Gulp前端自动化总结

对于一个前端项目，实现代码压缩、改名、图片压缩等功能是一个刚需，gulp全自动化则会帮助我们。借助browser-sync这个工具实现前端与代码的协同，所见即所改的效果则大大提升了我们的工作效率。这篇文章就给大家介绍我们使用gulp在前段的优化中的一些技巧。

1. 利用gulp-cssnano来对css文件进行压缩
2. 利用gulp-rename来对css文件进行改名
3. 利用gulp-uglify来对js文件就行丑化（压缩）
4. 利用gulp-concat来合并文件
5. 利用gulp-cache来对进行压缩过的图片做缓存，防止下一次的压缩（浪费时间）
6. 利用gulp-imagemin来对图片进行压缩、

在项目的根目录下面执行npm init，这样的话会生成一个pakage.json文件，来记录整个项目的信息，如下图：

我们gulp要安装两份，一份在系统的环境中，我们在使用终端的时候要用，另一份则是在我们的项目中，在编写gulpfile.js的时候，require需要。

给gulp添加一个任务的流程：

1. 导入各种的包（插件）var rename = require（‘gulp-rename’）（这个地方