首先要確保pc上裝有node，然后在global環(huán)境和項目文件中都install gulp
npm install gulp -g ? (global環(huán)境)
npm install gulp --save-dev (項目環(huán)境)
在項目中install需要的gulp插件，一般只壓縮的話需要
npm install gulp-minify-css gulp-concat gulp-uglify gulp-rename del --save-dev
更多插件可以在這個鏈接中找到?http://gratimax.net/search-gulp-plugins/
在項目的根目錄新建gulpfile.js蛾扇，require需要的module
var gulp = require('gulp'),
minifycss = require('gulp-minify-css'),
concat = require('gulp-concat'),
uglify = require('gulp-uglify'),
rename = require('gulp-rename'),
del = require('del');
壓縮css
gulp.task('minifycss', function() {
return gulp.src('src/*.css') ? ? ?//壓縮的文件
.pipe(gulp.dest('minified/css')) ? //輸出文件夾
.pipe(minifycss()); ? //執(zhí)行壓縮
});
壓縮js
gulp.task('minifyjs', function() {
return gulp.src('src/*.js')
.pipe(concat('main.js')) ? ?//合并所有js到main.js
.pipe(gulp.dest('minified/js')) ? ?//輸出main.js到文件夾
.pipe(rename({suffix: '.min'})) ? //rename壓縮后的文件名
.pipe(uglify()) ? ?//壓縮
.pipe(gulp.dest('minified/js')); ?//輸出
});
執(zhí)行壓縮前，先刪除文件夾里的內(nèi)容
gulp.task('clean', function(cb) {
del(['minified/css', 'minified/js'], cb)
});
默認命令展姐，在cmd中輸入gulp后殃饿，執(zhí)行的就是這個命令
gulp.task('default', ['clean'], function() {
gulp.start('minifycss', 'minifyjs');
});
8
然后只要cmd中執(zhí)行，gulp即可
