amaze ui基于gulp构建,所以现在安装gulp需要的环境,gulp使用npm安装,npm基于node.js 所以一切从node.js开始

1 下载对应的node.js

打开 https://nodejs.org/en/download/  自己对应的系统,下载

2 对下载完毕的文件进行安装

windows一路点击next 慢慢等待就完毕!

在命令行下输入  node  如果有交互提示 表示安装成功

如果没有则查看系统变量Path,把path配置上去。

3 创建测试代码 进一步测试

文件名 t.js

var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("test nodjs");
response.end();
}).listen(8899);
console.log("nodejs start listen 8899 port!");

进入命令行下 找到t.js存储的路径 运行  node t.js

浏览器中打开,也成功!

4 配置npm的全局路径

Windows下的Nodejs npm路径是appdata,可能不是我们想要的路径,可以改成我们指定的路径方便管理。 
在cmd下执行以下命令 
npm config set cache “D:\nodejs\node_cache” 
npm config set prefix “D:\nodejs\node_global” 
如果命令无效,可以去nodejs的安装目录中找到node_modules\npm\npmrc文件,这个文件存放npm的userconfig配置。 
修改如下即可: 
prefix = D:\nodejs\node_global 
cache = D:\nodejs\ node_cache

5 全局安装gulp

命令行下输入

npm install -g gulp

然后输入gulp -v,如果提示不是内部或外部命令,说明没有配置系统变量path,手动去配置pasth,地址是prefix的地址。

6 本地安装gulp

建立项目,创建Gulpfile.js和package.json文件,在项目目录

运行命令npm install gulp –save-dev,安装本地gulp。

安装完毕!打开基于gulp的项目amaze ui的模板可正常查看

7. gulp的实施与使用

创建工作目录与发布目录 
工作目录:即没有经过压缩合并等处理的文件存放目录。 
发布目录:即项目发布所引用的文件目录地址,这里的文件是经过gulp压缩合并等处理后生成的文件,处理过后的名字可以自定义,也可以不处理即与未处理文件名相同。

使用amaze ui模板全过程的更多相关文章

  1. 十、VueJs 填坑日记之在项目中使用Amaze UI

    上一篇博文,我们把jQuery集成到了项目中,今天我们来集成Amaze ui(妹子UI).先来介绍一下妹子UI.Amaze UI 含近 20 个 CSS 组件.20 余 JS 组件,更有多个包含不同主 ...

  2. js插件---Amaze UI dialog如何使用

    js插件---Amaze UI dialog如何使用 一.总结 一句话总结:别人给你列出来的参考手册照着用先 1.在哪里去找插件参考资料或者使用手册(一般位置找不到的时候)? github上面啊,非常 ...

  3. Amaze UI 模版中心上线丨十几款高质量优秀模版免费提供!

    Amaze UI模版中心终于上线了,目前汇聚了包含企业门户.新闻资讯.管理后台等多个领域的模版,全都可以免费下载. Amaze UI模版中心后续还会增加更多的模版以及领域,请各位持续关注. 模版中心的 ...

  4. 幻灯片插件FlexSlider -- Amaze UI幻灯片参数

    用了Amaze UI 的人就知道,其幻灯片插件是 data-am-slider='{}'来传参数的:(以下代码来自Amaze UI 官网) <div data-am-widget="s ...

  5. 目前几款基于html5的前端框架:如Bootstrap、Foundation、Semantic UI 、Amaze UI

    Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架,集合CSS 和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格.表格.按钮.表单.导 ...

  6. android自定义UI模板图文详解

    不知道大家在实际开发中有没有自定义过UI模板?今天花时间研究了一下android中自定义UI模板,与大家分享一下. 每个设计良好的App都是自定义标题栏,在自定义标题栏的过程中大部分人可能都是自定义一 ...

  7. DoNet开源项目-基于Amaze UI的点餐系统

    帮朋友做的点餐系统,主要是为了让顾客在餐桌上,使用微信扫描二维码,就可以直接点菜,吃完使用微信付款. 系统演示地址,账户名和密码均为:admin.(请不要删除admin用户) GitHub Clone ...

  8. 有了bootstrap,为什么还要做amaze ui

    1.Bootstrap介绍Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加 ...

  9. 移动端 前端框架 amaze ui

    移动端 前端框架 amaze ui http://amazeui.org/?_ver=2.x

随机推荐

  1. 哈勃(Hubble)望远镜的新发现

             请看下图: itok=FcRLe7t_" name="图形1" alt="" border="0" height ...

  2. Swift 学习笔记十五:扩展

    扩展就是向一个已有的类.结构体或枚举类型加入新功能(functionality).扩展和 Objective-C 中的分类(categories)相似.(只是与Objective-C不同的是,Swif ...

  3. 环境搭建之JAVA项目部署步骤

    一.配置java环境 1.linux下安装jdk,在此处安装1.7_x64的jdk,解压缩  tar -zxvf xxxxxxx 2.将jdk移动到/usr下 mv java /user/ 3.配置环 ...

  4. Oracle DataBase单实例使用ASM案例(1)--ASM基本概念

    版权声明:本文为博主原创文章,未经博主允许不得转载. Oracle DataBase单实例使用ASM案例(1)--ASM基本概念 系统环境: 操作系统:RH EL5-64 Oracle 软件: Ora ...

  5. yarn 制作 npm 包

    yarn publish yarn info [package_name]

  6. Ushare共享流媒体

    一. 支持USB 参考: http://wenku.baidu.com/link?url=K_uAp4QEa2cX3nPMkbc-colCAHA1yBwo1JCYsZf-qR7AVFPkmpbBVYR ...

  7. github高效搜索使用总结

    swoole 普通搜索 in:name swoole 搜索仓库的名称,搜索仓库名称包含swoole关键字的所有项目 in:description swoole 搜索描述中包含swoole关键字的项目 ...

  8. phper必知必会(二)

    1.说说你对进程,线程以及协程的理解 进程:是系统进行资源分配和调度的基本单位,是基本操作系统结构的基础.进程是程序基本执行的实体.进程与进程之间是独立的,拥有完全独立的地址空间,进程的切换只发生在内 ...

  9. 一个多maven项目聚合的实例

    本文转载自:http://my.oschina.net/xuqiang/blog/99854 本文介绍一个多maven项目的实例demo,展示了聚合.继承.工程依赖.单元测试.多war聚合.cargo ...

  10. 加快QT工程编译速度

    转载:学海方舟 利用Qt Creator编译工程大家都觉得慢,特别是整个工程重新编译时,那问题来了怎么加快编译速度呢 ,其实方法很简单,利用我们的强大的多核CPU来实现多核编译: 在编译参数中加入“- ...