官网常用 gulp配置文件

官网项目结构如图：

需安装的插件package.json

{
  "name": "gulptest",
  "version": "1.0.0",
  "description": "",
  "main": "gulpfile.js",
  "dependencies": {
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^3.1.1",
    "gulp-concat": "^2.6.0",
    "gulp-css-spriter": "^0.3.3",
    "gulp-declare": "^0.3.0",
    "gulp-handlebars": "^4.0.0",
    "gulp-imagemin": "^3.0.3",
    "gulp-less": "^3.1.0",
    "gulp-minify-css": "^1.2.4",
    "gulp-replace": "^0.5.4",
    "gulp-ruby-sass": "^2.1.0",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-uglify": "^2.0.0",
    "gulp-util": "^3.0.7",
    "gulp-watch-path": "^0.1.0",
    "gulp-wrap": "^0.13.0",
    "stream-combiner2": "^1.1.1"
  },
  "devDependencies": {
    "del": "^2.2.2",
    "gulp": "^3.9.1",
    "gulp-changed": "^1.3.2",
    "gulp-htmlmin": "^2.0.0",
    "gulp-rename": "^1.2.2"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

gulpfile.js配置文件

var gulp = require('gulp');
var minifyHTML = require('gulp-htmlmin');
var uglify = require('gulp-uglify');
var minifyCSS = require('gulp-minify-css');
var imagemin = require('gulp-imagemin');
var concat = require('gulp-concat');
var del = require('del');
var replace = require('gulp-replace');
gulp.task('minifyHTML', function () {
    gulp.src('*.html')
        .pipe(minifyHTML({collapseWhitespace: true}))
        .pipe(replace(/<script.*?>.*?>|<link.*?>|<\/head>/g, function (tag) {
            if (/<link.*?>/.test(tag)) {
                return "";
            } else if (/<\/head>/.test(tag)) {
                return '<link rel="stylesheet" href="css/all.css"></head>';
            }
        }))
        .pipe(gulp.dest('dist'));
});
gulp.task('script', function () {
    gulp.src('js/*.js')
        .pipe(uglify())
        .pipe(concat(new Date().getTime() + ".min.js"))//全部合并到all.js这个文件里
        .pipe(gulp.dest('dist/js'))
});
gulp.task('css', function () {
    gulp.src('css/*.css')
        .pipe(minifyCSS())
        .pipe(concat('all.css'))
        .pipe(gulp.dest('dist/css'));
});
gulp.task('images', function () {
    gulp.src('images/*.*')
        .pipe(imagemin({
            progressive: true
        }))
        .pipe(gulp.dest('dist/images'));
});
gulp.task('clean', function (cb) {
    del([
        /*  'dist/report.csv',
        // 这里我们使用一个通配模式来匹配 `mobile` 文件夹中的所有东西
        'dist/mobile/!**!/!*',
        // 我们不希望删掉这个文件，所以我们取反这个匹配模式
        '!dist/mobile/deploy.json'*/
        'dist/*'
    ], cb);
});
gulp.task('default', ['clean', 'minifyHTML', 'script', 'css', 'images']);