gulp系列:简单实践
coffescript测试源码
gulp = require('gulp') #删除 1、清空目录 常用插件 gulp-clean 、del (nodejs模块) del = require('del') #2、文件复制 原生模块gulp,插件:gulp-cpoy #3、JS压缩 插件:gulp-uglify uglify = require('gulp-uglify') #4、CSS压缩 插件:gulp-minify-css,gulp-uncss minifycss = require('gulp-minify-css') #去掉无用的css uncss = require('gulp-uncss') #5、html压缩 minifyhtml = require('gulp-minify-html') #6、文件合并 插件:gulp-minify-css,gulp-uncss concat = require('gulp-concat') #7、浏览器刷新 browserSync = require('browser-sync').create() #8 监视 插件:gulp-watch 原生模块:gulp gulp.task('default', ['clean','miniCSS','miniJS','miniHTML'], -> ) #9、其他 yargs gulp-notify通知 gulp-util # run-sequence异步同步执行任务[],[]中括号内为异步,两个括号件为同步 gulp.task('clean', (callback)-> #这种写法比较清晰 # del(['./dest/*.html','./dest/js/.js','./dest/css/**/*.css'], callback) #比较简洁的写法,类似正则 del('./dest/**/.{html,js.css}', callback) #注意点:不能使用/dest/css/**这种写法,经过多次测试,这才文件拷贝的时候会发生以下两种错误 # Error: ENOENT: no such file or directory # Error: EEXIST: file already exists, mkdir return ) gulp.task('miniCSS', -> gulp.src('src/**/*.css') .pipe(minifycss()) .pipe(gulp.dest('dest/css/')) return ) gulp.task('miniJS', -> gulp.src('src/js/*.js') .pipe(uglify()) .pipe(gulp.dest('dest/js/')) ) gulp.task('miniHTML',-> gulp.src('src/*.html') .pipe(minifyhtml()) .pipe(gulp.dest('dest/')) ) #gulp.task('server',['clean'], -> # browserSync.init({ # baseDir: 'dest/', # }, # port: 5000 # ) # gulp.watch(['./src/**/*.js','./src/**/*.css'],['watch']) # return #) #gulp.task('watch', ['miniCSS','miniJS','copyhtml'],-> # browserSync.reload(); # return #)