技术研究之gulp

1.安装gulp

先是全局安装:npm install gulp -g,然后在本地安装npm install gulp –save-dev,这里建议使用cnmp，使用npm可能会报一些莫名奇妙的错误。

2.安装child_process

npm install child_process –save-dev; child_process是什么作用(作用很大，安，就完事了)，主要执行子进程的命令行工具。
## 安装gulp-sequence
npm install gulp-sequence –save-dev; 随着慢慢的使用和学习，就知道了要想玩的溜，就要不停的安装插件，配合插件才能更好的执行gulp命令。gulp-sequence主要是为了让gulp命令能按顺序执行。

如果安装了gulp4.0版本，执行gulp-sequence会出现问题，提示：typeerror gulp.on(…).on(…).on(…).on(…).start is not a function gulp-sequence

这里主要是因为在gulp4中提供了gulp.series和gulp.parallel方法,这个时候就要使用gulp.series代替gulp-sequence模块了,类似于下面的内容。

1
2
3
4
5

//  默认  gulp 命令推送到仓库  (如需自定义 commit  执行  gulp -a 自定义commit)
gulp.task( 'default', gulp.series( 'back','add','commit', 'push',function(){
  console.log("压缩打包完成");
}));

3.安装minimist

npm install minimist –save-dev; minimist轻量级的命令行解析工具。使用方式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

//命令行中输入
gulp default -a "修改gulpfile"

//获取命令行参数
var argv = require('minimist')(process.argv.slice(2));
//输出参数
console.log(argv);
//结果别解析为一个对象
{ _: [ 'default' ], a: '修改gulpfile' }
//这个时候就可以直接使用
console.log(argv.a)
//输出结果为
'修改gulpfile'
//当然，你可以将 -a 换成其他的有意思的key,比如 -b
console.log(argv.b)
//就可以获取-b后边的内容，还可以继续添加
gulp default -a "修改gulpfile" -b "dss"
console.log(argv)
//输出
{ _: [ 'default' ], a: '修改gulpfile', b: 'dss' }

4.编写gulpfile.js文件

在本地(本地是哪个地方，自己琢磨，主要就是你本地安装gulp的那个地方)添加gulpfile.js文件，里面写一些任务，next中添加的是gulpfile.coffee文件，这个主要是用了coffee语法，需要安装coffee-script,具体怎么操作，喜欢coffee语法的朋友可以自行谷歌。

5.运行gulp命令

在命令行中直接写gulp命令就好了，gulp会自动查找当前目录下的gulpfile.js文件然后执行里面的default任务。