zoukankan      html  css  js  c++  java
  • 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
    #)



  • 相关阅读:
    水波图实现原理
    程序员
    从输入URL到页面加载的全过程
    前端性能优化的七大手段
    图片懒加载
    蚂蚁庄园
    关于一个无极限分类的问题
    微信JS-SDK的一点小注意
    PHP进行AES/ECB/PKCS7 padding加密的例子(mcrypt)
    PHP进行AES/ECB/PKCS7 padding加密的例子(openssl)
  • 原文地址:https://www.cnblogs.com/yinsolence/p/89088dbf567b4fefc14e5499649b3963.html
Copyright © 2011-2022 走看看