前端构建工具 Gulp

  1. npm install gulp -g=>通过gulp -v验证是否安装成功
  2. 当前目录下npm link gulp 或 配置gulp环境变量
  3. 新建gulpfile.js,并输入 gulp , gulp会自动执行命名为default的task,或输入 gulp 以执行指定的task
var gulp = require('gulp');

gulp.task('default', async function() {
  await console.log('将你的默认的任务代码放在这')
});
gulp.task('default2',  function(done) {
  console.log("使用async或回调解决'Did you forget to signal async completion?'报错")
  done()
});

//将所有.js后缀文件打包进destination目录下
gulp.task('task-name', function () {
  return gulp.src('./*.js') // Get source files with gulp.src
    // .pipe(aGulpPlugin()) // Sends it through a gulp plugin
    .pipe(gulp.dest('destination')) // Outputs the file in the destination folder
})
几个常用的通配符匹配模式
  • *.scss : * 号匹配当前目录任意文件,所以这里 *.scss 匹配当前目录下所有scss文件
  • */.scss :匹配当前目录及其子目录下的所有scss文件。
  • !not-me.scss :!号移除匹配的文件,这里将移除not-me.scss
  • *.+(scss|sass) :+号后面会跟着圆括号,里面的元素用|分割,匹配多个选项。这里将匹配scss和sass文件。

你可能感兴趣的:(前端构建工具 Gulp)