gulp基础概念和操作

// gulp 命令会执行导出的函数
// 任何导出(export)的函数都将注册到 gulp 的任务(task)系统中
//每个函数都是一个异步的gulp task, 可以有一个callback作为参数
// function defaultTask(cb) {
// cb()
// }


// exports.default = defaultTask;


//task分类
// 1. 公开task(直接导出的fun)
// 2. 私有tasK
// 那么存在两个函数series(串行任务结构) 和parallel(并行任务结构) 组合task导出
// 3. 相互嵌套
// const { series, parallel } = require('gulp');


// exports.build = series(
// clean,
// parallel(
// cssTranspile,
// series(jsTranspile, jsBundle)
// ),
// parallel(cssMinify, jsMinify),
// publish
// );

// 异步执行 返回Promise/stream/callback等---》任务(task)完成通知

const { src, dest } = require('gulp');
const babel = require('gulp-babel');
const uglify = require('gulp-uglify');
const path = require('path')

const invalidGlob = path.join(__dirname, 'src/*.js');

exports.default = function() {
return src(invalidGlob)
.pipe(babel())
.pipe(uglify())
.pipe(dest('output/'));
}


// 为了避免不同系统的路径问题 使用全局路径
// const invalidGlob = path.join(__dirname, 'src/*.js');

//gulp的功能基本上都是插件控制的 一般是用来转换文件


// 二 文件监控
// 将 globs(路径) 与 任务(task) 进行关联。
// 它对匹配 glob 的文件进行监控,如果有文件被修改了就执行关联的任务(task)。
// 如果被执行的任务(task)没有触发 异步完成 信号


const { watch, series } = require('gulp');
watch('src/*.css', css);
function css(cb) {
cb();
}
posted @ 2021-12-21 14:27  谢玉胜  阅读(57)  评论(0编辑  收藏  举报
@allenXieyusheng