1、安装node.js
2、终端,查看node -v
,出现版本号,说明已经正确安装node.js。npm -v
查看npm的版本号。(和node.js一起安装的)
3、使用npm安装cnpm,一个npm的镜像
npm install cnpm -g --registry=https://registry.npm.taobao.org
我命令行运行最后饱了错,提示权限问题。所以使用了sudo重新安装
sudo npm install cnpm -g --registry=https://registry.npm.taobao.org
然后cnpm -v
查看一下
完美安装了。
4、全局安装gulp(为了通过他执行gulp任务)
sudo cnpm install gulp -g
查看sudo gulp -v 安装正确
5、新建package.json文件
先定位到项目的根目录,然后cnpm init
然后就开始输入一些package里面的json信息。包括,name,version,description,entry point(入口文件创建的gulpfile.js)。最后信息填写完成,显示Is this ok?<yes>输入了y
之后结束。
6、安装gulp插件
定位到项目根目录,然后cnpm install --save-dev
,安装插件,例如cnpm install --save-dev gulp-compile-handlebars
7、新建gulpfile.js文件
创建一个gulpfile.js文件,放在了项目根目录下面。gulpfile.js是配置文件(我还不太明白这个配置文件为什么要作为入口文件),在这个配置文件里面导入工具包,创建任务。
8、运行gulp。
使用webstorm运行项目。找到gulpfile.js文件,右键找到“show gulp tasks”打开gulp窗口。然后选择相应的任务进行双击运行。
注:转载:http://www.ydcss.com/archives/18 详细教程链接,我安装gulp时的参考教程!