gulp

gulp 基本使用

gulp 入口文件 gulpfile.js

//  gulp 的入口文件
exports.foo = done =>{
  console.log('foo task working')
  done()
}

gulp 组合任务

// series: 并行组合
// parallel: 串行组合
const {series, parallel} = require("gulp")
const task2 = done => {
  setTimeout(() => {
    console.log("task2 workding")
    done()
  }, 1000);
}

const task3 = done => {
  setTimeout(() => {
    console.log("task3 workding")
    done()
  }, 1000);
}
// 串行任务
exports.foo = series(task1,task2,task3)
// 并行任务
exports.bar = parallel(task1,task2,task3)

异步函数

// 异步任务

exports.promise = () =>{
  console.log('promise task')
  return Promise.resolve()
}
const timeout = () => {
    return new Promise(resolve => {
      
      setTimeout(function(){
        console.log('你好啊')
        resolve()
      }, 1000);
    })
}
// 先打印 你好啊， 在打印我挺好的
exports.async = async () =>{
  await timeout()
  console.log('我挺好的')  // 一秒之后才执行 我挺好的
}

开发服务器 (browerSync)

gulp 开发服务器使用 browerSync 插件来启动服务

gulp 自动化构建案例 （watch）

代码修改之后自动编译 使用 watch + broswerSync

useref 文件引用处理

处理打包之后的文件引用

gulp 压缩文件

gulp-htmlmini gulp-uglify gulp-clean-css

dependencies 和 devDependencise 的区别

dependencies 会在安装模块时自动安装依赖