标签:
参考:http://www.ydcss.com/archives/18 http://www.tuicool.com/articles/FJVNZf
1.淘宝npm服务 :npm install cnpm -g --registry=https://registry.npm.taobao.org
2.全局安装gulp cnpm install gulp -g 查看版本:gulp -v
3.进到项目根目录执行: cnpm init 该命令创建package.json文件
4.本地安装gulp cnpm install gulp --save-dev
使用 —-save-dev
来更新package.json文件,更新 devDependencies
值,以表明项目需要依赖gulp,该依赖关系会保存在package.json中
5.安装执行任务需要的插件 : cnpm install jshint gulp-jshint gulp-sass gulp-concat gulp-uglify gulp-rename --save-dev
jshint要安装
6.新建 gulpfile.js
// 引入 gulp var gulp = require(‘gulp‘); // 引入组件 var jshint = require(‘gulp-jshint‘); var sass = require(‘gulp-sass‘); var concat = require(‘gulp-concat‘); var uglify = require(‘gulp-uglify‘); var rename = require(‘gulp-rename‘); // 检查脚本 gulp.task(‘lint‘, function() { gulp.src(‘./js/*.js‘) .pipe(jshint()) .pipe(jshint.reporter(‘default‘)); }); // 编译Sass gulp.task(‘sass‘, function() { gulp.src(‘./scss/*.scss‘) .pipe(sass()) .pipe(gulp.dest(‘./css‘)); }); // 合并,压缩文件 gulp.task(‘scripts‘, function() { gulp.src(‘./js/*.js‘) .pipe(concat(‘all.js‘))//合并所有js到all.js中 .pipe(gulp.dest(‘./dist‘)) .pipe(rename(‘all.min.js‘))//重命名 .pipe(uglify())//丑化-压缩 .pipe(gulp.dest(‘./dist‘));
gulp.src(‘./js/xxxxxx‘)....多个文件夹的情况 }); // 默认任务 gulp.task(‘default‘, function(){ gulp.run(‘lint‘, ‘sass‘, ‘scripts‘); // 监听文件变化 gulp.watch(‘./js/*.js‘, function(){ gulp.run(‘lint‘, ‘sass‘, ‘scripts‘); }); });
7.执行任务 : gulp scripts
标签:
原文地址:http://www.cnblogs.com/oyx305/p/5626415.html