[TOC] ## 简介 [使用gulp](https://github.com/Platform-CUF/use-gulp) **全局安装 gulp 是为了可以运行命令行， 而项目中得 gulp 是为了项目脚本依赖。** 一般命令行工具都会全局安装，项目中用到的类库还是建议跟着项目走，这样每个项目可以使用自己的空间存放依赖列表，而不会造成全局污染和版本冲突。别人拿到你项目的时候，直接 npm install 就可以安装所有依赖，并立刻执行了。 所以在每个项目中还要再次安装： ~~~ npm install gulp --save-dev //或者 npm i gulp -D ~~~ 使用从网上下载的其他项目时，我们一般是把作者创建好的package.json直接拿过来，放到项目根目录下，然后 `npm install` 一下，这样该项目需要的gulp插件自动就安装好了。 ## BrowserSync Browsersync能让浏览器实时、快速响应您的文件更改（html、js、css、sass、less等）并自动刷新页面。 https://browsersync.io/docs ## 雪碧图 gulp-css-spriter 雪碧图合并 ## gulp-sass 这个过程中会先安装 node-sass ，因为 **gulp-sass 依赖于 node-sass** 。 安装命令： ~~~ npm i gulp-sass -D /* -S: --save -D: --save-dev npm i -h */ ~~~ node-sass 安装卡在 node scripts/install.js 解决办法: ======== 7月12日更新 ======== 总的来说就是两种方法解决： ~~~ npm i gulp-sass -D --SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/ ~~~ 或者在 ~/.npmrc 里添加下面这行（参考），保存后再 `npm install (**如果是用的 cnpm，需要添加到 ~/.cnpmrc**) ~~~ sass_binary_site=https://npm.taobao.org/mirrors/node-sass/ ~~~ ## [gulp 中的增量编译](http://www.cnblogs.com/zichi/p/6265208.html) `gulp watch`启动监听，此时修改 sass 文件夹下的任意文件，都会编译该文件夹下的所有文件，这不是我们希望的，我们希望只对修改过的文件进行编译，即**增量编译**（Incremental Builds）。 ## Gulp 插件编写 [gulp中文入门教程](http://www.tangshuang.net/3126.html) [精通gulp的关键：文件路径匹配模式globs](http://yangbo5207.github.io/gulp/2016/08/10/new.html) [GULP排除已压缩文件思路](http://hao.jser.com/archive/13401/) ## 参考 https://www.npmjs.com/package/gulp-youkuvip https://www.npmjs.com/package/gulp-turbo https://gitee.com/chandlerver5/gulp-example/