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:
odejs
ode_cache”
npm config set prefix “D:
odejs
ode_global”
如果命令无效,可以去nodejs的安装目录中找到node_modules
pm
pmrc文件,这个文件存放npm的userconfig配置。
修改如下即可:
prefix = D:
odejs
ode_global
cache = D:
odejs 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压缩合并等处理后生成的文件,处理过后的名字可以自定义,也可以不处理即与未处理文件名相同。