包括了less预编译，css压缩，html文件include引入，js混淆压缩，本地开发热刷新服务器，html压缩，版本号添加
github地址：
gulpfile.js
var gulp = require('gulp'), //基础库
imagemin = require('gulp-imagemin'), //图片压缩
less = require('gulp-less'), // less
minifycss = require('gulp-minify-css'), //css压缩
fileinclude = require('gulp-file-include'), // 文件包含
//jshint = require('gulp-jshint'), //js检查
uglify = require('gulp-uglify'), //js压缩
rename = require('gulp-rename'), //重命名
//concat = require('gulp-concat'), //合并文件
//clean = require('gulp-clean'), //清空文件夹
notify = require('gulp-notify'), // 信息提示
plumber = require('gulp-plumber'),
connect = require('gulp-connect'), //本地开发web服务器，包括实时刷新
rev = require('gulp-rev'),
revCollector = require('gulp-rev-collector'),
revReplace = require('gulp-rev-replace'),
minifyHTML = require('gulp-minify-html');
var devDir = 'dist';
/** less编译 **/
gulp.task('less', function () {
gulp.src('./src/less/mspei.less')
.pipe(less())
//.pipe(rename({ suffix: '.min' }))
//.pipe(minifycss())
.pipe(gulp.dest('./'+devDir+'/css/'));
});
/** js **/
gulp.task('js', function () {
gulp.src(['./src/js/**/*'])
.pipe(gulp.dest('./'+devDir+'/js/'));
});
/** 通用文件包含 **/
gulp.task('fileinclude', function() {
gulp.src(['./src/views/**/*.html', '!./src/views/include/**.html'])
.pipe(fileinclude({
prefix: '@@',
basepath: '@file'
}))
.pipe(gulp.dest('./'+devDir+'/'));
});
/** 图片处理 **/
gulp.task('images', function () {
gulp.src(['./src/images/**/*'])
.pipe(gulp.dest('./'+devDir+'/images/'));
});
/** 字体图标 **/
gulp.task('fonts', function () {
gulp.src(['./src/fonts/**/*'])
.pipe(gulp.dest('./'+devDir+'/fonts/'));
});
/** 使用connect启动一个Web服务器 **/
gulp.task('connect', function () {
connect.server({
root: './'+devDir+'/',
livereload: true
});
});
/** 刷新页面 **/
gulp.task('reload', function () {
gulp.src('./'+devDir+'/**/*.html')
.pipe(connect.reload());
});
/** 监测文件变动，设置自动执行的任务 **/
gulp.task('watch', function () {
gulp.watch('./src/less/**/*.less', ['less', 'reload']); // 当所有less文件发生改变时，调用less任务
gulp.watch('./src/js/**/*.js', ['js', 'reload']); // 当所有js文件发生改变时，调用js任务
gulp.watch('./src/views/**/*.html', ['fileinclude', 'reload']); // 当所有模板文件变化时，重新生成生成页面到根目录
gulp.watch('./src/images/**/*', ['images']); // 监听images
});
/** 开发时，运行 'gulp dev' **/
gulp.task('dev', ['connect', 'less', 'js', 'fileinclude', 'images', 'fonts', 'reload', 'watch']);
/*****************************************************************
* dist版本，压缩版
****************************************************************/
/** less编译 **/
gulp.task('lessDist', function () {
gulp.src('./src/less/mspei.less')
.pipe(less())
//.pipe(rename({ suffix: '.min' }))
.pipe(minifycss())
.pipe(rev())
.pipe(gulp.dest('./dist/css/'))
.pipe(rev.manifest())
.pipe(gulp.dest('./src/rev/css'));
});
/** js **/
gulp.task('jsDist', function () {
gulp.src(['./src/js/**/*', '!./src/js/**/*.js'])
.pipe(gulp.dest('./dist/js'));
gulp.src(['./src/js/**/*.js'])
.pipe(uglify({
mangle: {except: ['require', 'exports', 'module', '$']}
}))
.pipe(rev())
.pipe(gulp.dest('./dist/js/'))
.pipe(rev.manifest())
.pipe(gulp.dest('./src/rev/js'));
});
/** 通用文件包含 **/
gulp.task('fileincludeDist', function() {
gulp.src(['./src/views/**/*.html', '!./src/views/include/*.html'])
.pipe(fileinclude({
prefix: '@@',
basepath: '@file'
}))
.pipe(gulp.dest('./dist/'));
});
/** 图片处理 **/
gulp.task('imagesDist', function () {
gulp.src(['./src/images/**/*'])
.pipe(gulp.dest('./dist/images/'));
});
/** 字体图标 **/
gulp.task('fontsDist', function () {
gulp.src(['./src/fonts/**/*'])
.pipe(gulp.dest('./dist/fonts/'));
});
gulp.task('commonRev', function () {
return gulp.src(['src/rev/**/*.json', 'dist/**/*.html'])
.pipe( revCollector({
replaceReved: true,
dirReplacements: {
'css': 'css',
'js': 'js',
//'cdn/': function(manifest_value) {
// return '//cdn' + (Math.floor(Math.random() * 9) + 1) + '.' + 'exsample.dot' + '/img/' + manifest_value;
//}
}
}) )
.pipe( minifyHTML({
empty:true,
spare:true
}) )
.pipe( gulp.dest('dist') );
});
//处理seajs脚本的模块引用
gulp.task("seaRev", function() {
var jsManifest = gulp.src('./src/rev/js/*.json');
return gulp.src(["src/js/config.js"], {
base: "src/js"
})
.pipe(revReplace({
manifest: jsManifest
}))
.pipe(rev())
.pipe(gulp.dest("dist/js"))
.pipe(rev.manifest("rev-manifest-seajs.json", {
merge: true
}))
.pipe(gulp.dest("src/rev/js"));
});
/** 发布时，运行 'gulp dist' **/
/** 需版本号，再运行 'gulp rev' **/
gulp.task('dist', ['lessDist', 'jsDist', 'fileincludeDist', 'imagesDist', 'fontsDist']);
gulp.task('rev', ['commonRev', 'seaRev']);
package.json
{
"name": "mspei_front",
"version": "1.0.0",
"description": "",
"main": "index.js",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-asset-rev": "^0.0.15",
"gulp-connect": "^4.1.0",
"gulp-file-include": "^0.13.7",
"gulp-imagemin": "^3.0.1",
"gulp-less": "^3.1.0",
"gulp-livereload": "^3.8.1",
"gulp-minify-css": "^1.2.4",
"gulp-notify": "^2.2.0",
"gulp-plumber": "^1.1.0",
"gulp-rename": "^1.2.2",
"gulp-rev": "^7.1.2",
"gulp-rev-collector": "^1.0.5",
"gulp-uglify": "^2.0.0",
"gulp-rev-replace": "^0.4.3",
"gulp-minify-html": "^1.0.6"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "nuanfeng",
"license": "ISC"
}