开始接触LESS、组件化编程后,慢慢意识到需要一个提高工作效率的构建工具,就此接触到了Gulp。
Gulp的好处在这里就不细说啦,只有四个API接口学起来简直爽歪歪,减少了大量的I/O操作,用起来很畅快。另外丰富的插件能99.9%满足你的需求,剩下的0.1%还可以自己写啊吼吼吼吼。总结一下自己觉得好用的常用的插件:
gulp-plumber :
如果说Gulp是一条水管,那gulp-plumber就是水管工。无论在文件处理过程中的哪一步出现问题,都会反映在终端上。
gulp-less/sass:
把less sass预语言编译成浏览器认识的css;
gulp-postcss:
可以根据你的需要来优化你的css代码。
postcss有很多不同功能的插件,可以按需调用,比如:可以自动添加浏览器兼容前缀的
autoprefixer
,写css的时候再也不用ms
webkit
mom
o
一串写下来啦。还有PreCSS可以检查代码中的@if else
,编译符合需求的代码。 更多的插件可以在npm或者github上看文档。
gulp-minify-css:
预处理完样式文件之后,用它来压缩,尽量减少文件大小。
gulp-jshint:
检查JS文件是否存在错误。
gulp-uglify:
JS文件压缩。
gulp-concat:
各种文件合并。
browserSync:
监听文件,如果文件被修改,自动刷新页面。提高工作效率一大利器!
之后会继续学习拓展gulp的功能,继续更新。关于插件的安装,记住在命令行
npm install (插件名)
后面加上--save-dev
, 把需要安装的插件加进项目的package.json 里,之后其他人借用就可以直接npm install
一次安装啦!