gulpfile.js如下
输出的all.min.css是没有压缩的. 为什么!!!
var gulp = require('gulp'), //基础库
imagemin = require('gulp-imagemin'), //图片压缩
minifycss = require('gulp-minify-css'), //css压缩
jshint = require('gulp-jshint'), //js检查
uglify = require('gulp-uglify'), //js压缩
rename = require('gulp-rename'), //重命名
concat = require('gulp-concat'), //合并文件
connect = require('gulp-connect'), //web服务
useref = require('gulp-useref'), //处理引用
del = require('del'); //清空文件夹
var Path = {
css_src: './src/css/*.css',
css_dist: './dist/css/',
css_theme_src: './src/css/themes/**/*.*',
css_theme_dist: './dist/css/themes/',
img_src: './src/image/*.*',
img_dist: './dist/image/',
js_src: './src/js/**/*.js',
js_dist: './dist/js/',
js_lib_src: './src/lib/*.js',
js_lib_dist: './dist/lib/',
html_src: './src/**/*.html',
html_dist: './dist/'
};
// 样式处理
gulp.task('css', function () {
gulp.src(Path.css_src)
.pipe(concat('all.min.css'))
.pipe(minifycss())
.pipe(gulp.dest(Path.css_dist))
.pipe(connect.reload());
gulp.src(Path.css_theme_src)
.pipe(gulp.dest(Path.css_theme_dist))
.pipe(connect.reload());
});
// 图片处理
gulp.task('image', function () {
gulp.src(Path.img_src)
.pipe(imagemin())
.pipe(gulp.dest(Path.img_dist))
.pipe(connect.reload());
});
// js处理
gulp.task('js', function () {
gulp.src(Path.js_lib_src)
.pipe(rename({suffix: '.min'}))
.pipe(uglify())
.pipe(gulp.dest(Path.js_lib_dist))
.pipe(connect.reload());
gulp.src(Path.js_src)
.pipe(jshint('.jshintrc'))
.pipe(jshint.reporter('default'))
.pipe(concat('all.min.js'))
.pipe(uglify())
.pipe(gulp.dest(Path.js_dist))
.pipe(connect.reload());
});
// HTML处理
gulp.task('html', function () {
gulp.src(Path.html_src)
.pipe(useref())
.pipe(gulp.dest(Path.html_dist))
.pipe(connect.reload());
});
// 清空img css js html
gulp.task('clean', function () {
del.sync(['./dist/css', './dist/image', './dist/js', './dist/**/*.html'])
});
//服务
gulp.task('connect', function () {
connect.server({
livereload: true
});
});
// 默认任务
gulp.task('default', ['clean', 'watch', 'connect'], function () {
gulp.start('css', 'image', 'js', 'html');
});
// 监听任务 运行语句 gulp watch
gulp.task('watch', function () {
// 监听css
gulp.watch('./src/css/*.css', function () {
gulp.run('css');
});
// 监听image
gulp.watch('./src/image/*.*', function () {
gulp.run('image');
});
// 监听js
gulp.watch('./src/js/**/*.js', function () {
gulp.run('js');
});
// 监听html
gulp.watch('./src/**/*.html', function () {
gulp.run('html');
})
});
npm上显示
gulp-minify-css
已经废弃了, 你可以尝试使用这个插件gulp-cssnano