-
Notifications
You must be signed in to change notification settings - Fork 0
/
gulpfile.js
132 lines (120 loc) · 4.59 KB
/
gulpfile.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var babel = require('gulp-babel');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var cssmin = require('gulp-minify-css');
var htmlmin = require('gulp-htmlmin');
var rev = require('gulp-rev-append');
var livereload = require('gulp-livereload');
// 获取 gulp-imagemin 模块
var imagemin = require('gulp-imagemin');
// 深度压缩图片
pngquant = require('imagemin-pngquant');
var htmlOptions = {
removeComments: true, // 清除HTML注释
collapseWhitespace: true, // 压缩HTML
collapseBooleanAttributes: true, // 省略布尔属性的值 <input checked="true"/> ==> <input />
removeEmptyAttributes: true, // 删除所有空格作属性值 <input id="" /> ==> <input />
removeScriptTypeAttributes: true, // 删除<script>的type="text/javascript"
removeStyleLinkTypeAttributes: true, // 删除<style>和<link>的type="text/css"
minifyJS: true, // 压缩页面JS
minifyCSS: true // 压缩页面CSS
};
gulp.task('htmlmin', function() {
gulp.src('./src/tpl/*.html')
.pipe(htmlmin(htmlOptions))
.pipe(gulp.dest('./dist/tpl'));
// 压缩views的html文件
gulp.src('./src/views/*.html')
.pipe(htmlmin(htmlOptions))
.pipe(gulp.dest('./dist/views'));
})
gulp.task('cssmin', function() {
gulp.src('./src/css/**/*.css')
.pipe(cssmin({
// 类型:Boolean 默认:true [是否开启高级优化(合并选择器等)]
advanced: false,
// 保留ie7及以下兼容写法 类型:String 默认:''or'*' [启用兼容模式; 'ie7':IE7兼容模式,'ie8':IE8兼容模式,'*':IE9+兼容模式]
compatibility: 'ie7',
// 类型:Boolean 默认:false [是否保留换行]
keepBreaks: true,
// 保留所有特殊前缀 当你用autoprefixer生成的浏览器前缀,如果不加这个参数,有可能将会删除你的部分前缀
keepSpecialComments: '*'
}))
.pipe(gulp.dest('./dist/css'));
// 压缩views的css
gulp.src('./src/views/css/*.css')
.pipe(cssmin({
// 类型:Boolean 默认:true [是否开启高级优化(合并选择器等)]
advanced: false,
// 保留ie7及以下兼容写法 类型:String 默认:''or'*' [启用兼容模式; 'ie7':IE7兼容模式,'ie8':IE8兼容模式,'*':IE9+兼容模式]
compatibility: 'ie7',
// 类型:Boolean 默认:false [是否保留换行]
keepBreaks: true,
// 保留所有特殊前缀 当你用autoprefixer生成的浏览器前缀,如果不加这个参数,有可能将会删除你的部分前缀
keepSpecialComments: '*'
}))
.pipe(gulp.dest('./dist/views/css'));
})
gulp.task('jsmin', function() {
gulp.src('./src/js/**/*.js')
.pipe(sourcemaps.init())
.pipe(babel({
presets: ['es2015', 'stage-2']
}))
.pipe(uglify({
mangle: true, // 类型:Boolean 默认:true 是否修改变量名
compress: true, // 类型:Boolean 默认:true 是否完全压缩
// preserveComments: 'all' // 保留所有注释w
}))
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest('./dist'));
// 压缩views的js文件
gulp.src('./src/views/**/*.js')
.pipe(sourcemaps.init())
.pipe(babel({
presets: ['es2015', 'stage-2']
}))
.pipe(uglify({
mangle: true, // 类型:Boolean 默认:true 是否修改变量名
compress: true, // 类型:Boolean 默认:true 是否完全压缩
// preserveComments: 'all' //保留所有注释w
}))
.pipe(sourcemaps.write("."))
.pipe(gulp.dest('./dist/views'));
})
gulp.task('revhtml', function() {
gulp.src('./src/index.html')
.pipe(rev())
.pipe(htmlmin(htmlOptions))
.pipe(gulp.dest('./dist'))
.pipe(livereload());
})
// 压缩图片任务
// 在命令行输入 gulp images 启动此任务
gulp.task('images', function () {
// 压缩img文件夹的图片
gulp.src('src/img/*.*')
.pipe(imagemin({
progressive: true,
optimizationLevel: 7,
use: [pngquant()]
}))
.pipe(gulp.dest('dist/img'))
// 压缩views的图片
gulp.src('src/views/images/*.*')
.pipe(imagemin({
progressive: true
}))
.pipe(gulp.dest('dist/views/images'));
});
gulp.task('mywatch', function() {
livereload.listen();
gulp.watch(['./src/js/**/*.js', './src/views/**/*.js', './src/**/*.html', './src/views/*.html'
, './src/css/**/*.css', './src/views/css/*.css', './src/index.html', 'src/img/*.*', 'src/views/images/*.*'],
['jsmin', 'htmlmin', 'cssmin', 'revhtml', 'images'],
function(event){
console.log(`${event.path} was ${event.type} , running tasks...`);
})
})