首页 > 代码库 > gulp使用学习记录
gulp使用学习记录
gulp是一个nodejs的streaming构建工具,所谓的streaming大致意思就是把构建流程想成一个个链接的管道(pipe)。
1.什么是src和pipe?如下使用到了src 与 pipe
gulp.src(‘spec/google.spec.js‘)
.pipe(jasmine());
我们先看一个unix命令:
cat gulpfile.js | wc -l
这是两个独立的命令,cat gulpfile.js用来获取gulpfile.js的文件内容,wc -l用来统计文件中的行数,他们中间用“|”相连。把cat gulpfile.js的输出作为wc -l的输入。这是再常见不过的unix命令
gulp中吸取了这样的想法,上面gulp命令可以想作:
‘spec/google.spec.js‘ | jasmine()
通俗理解,src里放的是要操作的文件,pipe里放的是对文件操作的方法.
2.基本的五个gulp命令
gulp.task(name, fn)这个你已经见过了
gulp.run(tasks...)尽可能多的并行运行多个task
gulp.watch(glob, fn)当glob内容发生改变时,执行fn
gulp.src(glob)返回一个可读的stream
gulp.dest(glob)返回一个可写的stream
其他gulp插件
1.gulp-jshint //语法检查
使用方法:
gulp.task(‘jshint‘,function(){
return gulp.src(‘public/javascript/*.js‘)
.pipe(jshint())
.pipe(jshint.reporter("default"))
//.pipe(jshint.reporter("jshint-default")) //或直接引用,不使用上一行的方式
})
技巧:
如果想查看检查结果的详细的错误信息,可以使用 map-stream 这个插件
检索代码具体错误信息插件的安装命令:cnpm install --save-dev map-stream
- var map = require("map-stream");
- var customerReporter = map(function(file,cb){
- if(!file.jshint.success){
- //打印出错误信息
- console.log("jshint fail in:" + file.path);
- file.jshint.results.forEach(function(err){
- if(err){
- console.log(err);
- console.log("在 "+file.path+" 文件的第"+err.error.line+" 行的第"+err.error.character+" 列发生错误");
- }
- });
- }
- });
- gulp.task("scripts",function(){
- gulp.src("src/js/*.js")
- .pipe(jshint())
- .pipe(customerReporter);
- })
执行命令: gulp scripts
2.
gulp使用学习记录