基本gulpfile.js
来源:互联网 发布:网络监控调试方案 编辑:程序博客网 时间:2024/06/06 03:58
/** * Created by wangdanting on 16/11/22. */const gulp = require('gulp');const del = require('del');//less autoprefixconst lessAutoprefix = require('less-plugin-autoprefix');const autoprefix = new lessAutoprefix({browsers: ['last 2 versions']});//load gulp pluginsconst gulpLoadPlugins = require('gulp-load-plugins');const plugins = gulpLoadPlugins({ scope: ['devDependencies'], rename: { 'gulp-clean-css': 'cleanCSS', 'gulp-minify-html': 'minifyHTML', 'gulp-rev-replace': 'revReplace', 'gulp-rev-css-url': 'revCSSURL' }});//生产环境var isProduction = process.env.NODE_ENV !== 'dev';//合并文件const CSS_FILENAME = 'app.css';const JS_FILENAME = 'app.js';//目录配置var paths = { html: 'src/**/*.html', js: 'src/**/*.js', css: 'src/**/*.css', template: ['src/**/*.html'], less: 'src/**/*.less', image: { gif: 'src/**/*.gif', jpg: 'src/**/*.jpg', png: 'src/**/*.png' }, font: { woff: 'src/**/*.woff', eot: 'src/**/*.eot', svg: 'src/**/*.svg', ttf: 'src/**/*.ttf' }, dist: 'dist'};//task cleangulp.task('clean', function(callback) { var distPath = 'dist/**/*'; return del(distPath, callback);});gulp.task('build-assets', ['clean'], function() { var jsFilter = plugins.filter(['**/*.js'], { restore: true }); var cssFilter = plugins.filter(['**/*.css'], { restore: true }); var lessFilter = plugins.filter(['**/*.less'], { restore: true }); var imageFilter = plugins.filter(['**/*.gif', '**/*.jpg', '**/*.png'], { restore: true }); var srcPaths = [ paths.js, paths.css, paths.less, paths.image.gif, paths.image.jpg, paths.image.png, paths.font.woff, paths.font.eot, paths.font.svg, paths.font.ttf ]; return gulp.src(srcPaths) .pipe(plugins.plumber({errorHandler: plugins.notify.onError("错了。。")})) // .pipe(plugins.notify("hello time")) .pipe(plugins.flatten()) //remove or replace relative path for files .pipe(lessFilter) //less .pipe(plugins.less()) .pipe(lessFilter.restore) .pipe(cssFilter) //minify css .pipe(plugins.concat(CSS_FILENAME)) .pipe(plugins.less({plugins: [autoprefix]})) //prefix .pipe(plugins.cleanCSS()) .pipe(cssFilter.restore) .pipe(jsFilter) //minify js .pipe(plugins.concat(JS_FILENAME)) .pipe(plugins.if(isProduction, plugins.uglify())) //gulp-if .pipe(jsFilter.restore) .pipe(imageFilter) //minify image .pipe(plugins.if(isProduction, plugins.imagemin({ progressive: true, //Lossless conversion to progressive interlaced: true //interlace gif for progressive rendering }))) .pipe(imageFilter.restore) .pipe(plugins.rev()) //appending hash .pipe(plugins.rename(function(path) { //rename to hash path.basename = path.basename.replace(/[\w\.]+-/g, ''); return path; })) .pipe(plugins.revCSSURL()) //the lightweight plugin to override urls in css files to hashed after gulp-rev .pipe(gulp.dest(paths.dist)) //dest .pipe(plugins.rev.manifest()) //rev manifest .pipe(gulp.dest('./'));});//task buildgulp.task('build', ['build-assets'], function() { var manifestFile = gulp.src('./rev-manifest.json'); return gulp.src(paths.html) .pipe(plugins.revReplace({ //rewrite occurences of filenames which have been renamed by gulp-rev manifest: manifestFile, prefix: 'dist/' //default prefix })) .pipe(plugins.flatten()) .pipe(plugins.minifyHTML({ empty: true, //do not remove empty attributes spare: true, //do not remove redundant attributes quotes: true, //do not remove arbitrary quotes conditionals: true //do not remove conditional internet explorer comments })) .pipe(gulp.dest('./'))});//task watchgulp.task('watch', function() { gulp.watch(paths.js, ['build']); gulp.watch(paths.css, ['build']); gulp.watch(paths.less, ['build']); gulp.watch(paths.html, ['build-assets']);});//task devgulp.task('default', ['build', 'watch']);//task releasegulp.task('release', ['build']);
0 0
- 基本gulpfile.js
- 我的gulpfile.js
- 简单gulpfile.js写法
- gulp配置文件gulpfile.js
- gulpfile.js的配置
- gulpfile.js文件内容
- Gulpfile.js 详解
- gulpfile.js常用配置文件
- gulpfile.js 备份
- 项目使用的gulpfile.js
- 前端 | 重构 gulpfile.js
- gulpfile
- 自动化构建工具Gulp配置文件gulpfile.js
- Gulp的配置文件gulpfile.babel.js
- 关于gulpfile.js和package.json
- gulp的gulpfile.js文件配置
- gulpfile.js文件创建与配置
- 包含常用功能的 gulpfile.js
- 设置maven可以自动下载jar包的sources以及JavaDoc
- C语言中函数参数入栈的顺序
- 自主导航nav_test.py代码分析
- 分布式一致性算法--raft
- 错误的单例模式(饱汉饿汉)
- 基本gulpfile.js
- 栅栏密码
- android商品详情详解
- 报错:1130-host ... is not allowed to connect to this MySql server 开放mysql远程连接 不使用localhost
- 因spfile文件错误,11g某节点实例起不来
- mongodb 添加用户及权限设置详解
- iOS FFmpeg 在Mac OS下的编译和使用
- 性状 Trait 的简单使用与理解
- Sqoop导入hive分隔符问题