标签:
Gulp 是一款基于任务的设计模式的自动化工具,通过插件的配合解决全套前端解决方案,如静态页面压缩、图片压缩、JS合并、SASS同步编译并压缩CSS、服务器控制客户端同步刷新。
全局安装:
$ npm install -g gulp
1. 将安装包放在 /usr/local 下
2. 可以直接在命令行里使用
局部安装:
$ npm install gulp --save-dev
1. 将安装包放在 ./node_modules 下(运行npm时所在的目录)
2. 可以通过 require() 来引入本地安装的包
一般推荐全局安装。
$ npm install --save-dev gulp
gulpfile.js
的文件var gulp = require(‘gulp‘);//跟node。js相似,也是需要什么就require什么
//默认任务 gulp.task(‘default‘, function() { //这里输入默认任务的代码,function()也可以写成数组里面放需要默认执行的任务 });
/*全部执行(执行默认任务)*/ $ gulp /*执行指定任务*/ $ gulp 任务名
安装外挂:
$ npm install 外挂名
require(“外挂名”)
gulp.task(‘任务名‘, function() { return gulp.src(‘源路径‘) .pipe(gulp.dest(‘存放的路径‘)) .pipe(minifycss())//压缩css文件 .pipe(gulp.dest(‘dist/assets/css‘))//完成之后存放的位置 });
src:目标源路径
dest:完成之后存放的位置
为了能够看守档案,并在更动发生后执行相关任务,首先需要建立一个新的任务,使用gulp.watch
来看守档案:
gulp.task(‘watch‘, function() { // 看守所有.css档 gulp.watch(‘src/*.css‘, [‘任务名‘]); // 看守所有.js档 gulp.watch(‘src/*.js‘, [‘任务名‘]); // 看守所有图片档 gulp.watch(‘src/*‘, [‘任务名‘]); });
标签:
原文地址:http://www.cnblogs.com/R46W8/p/5006001.html