gulp - 在 gulp 文件中只调用最后一个回调
问题描述
在 gulpfile 中,我有 3 个任务,当我运行以下代码时,它只执行最后一个任务的回调。我希望如果我运行gulp
命令,在完成清理任务后,它应该执行copy:db和默认任务的回调。
Gulp.task('clean', function () {
console.log('Clean');
return Gulp.src("./dbSchema/*")
.pipe(VinylPaths(Del));
})
Gulp.task('copy:db', Gulp.series("clean"), function () {
console.log('Copy DB');
return Gulp.src("./db/*")
.pipe(Gulp.dest("./dbSchema"));
})
Gulp.task('default', Gulp.series("copy:db"), function () {
console.log('defaulp');
return TypeScriptProject.src()
.pipe(TypeScriptProject())
.js.pipe(Gulp.dest('dist'));
});
当我运行命令gulp
时,它显示以下日志。
[12:46:37] Starting 'default'...
[12:46:37] Starting 'copy:db'...
[12:46:37] Starting 'clean'...
Clean
[12:46:37] Finished 'clean' after 26 ms
[12:46:37] Finished 'copy:db' after 28 ms
[12:46:37] Finished 'default' after 31 ms
谁能告诉我我哪里出错了?
解决方案
为了让您的代码按照您的描述工作,回调函数需要作为参数传递给.series()
. 例如:
Gulp.task('clean', function () {
console.log('Clean');
return Gulp.src("./dbSchema/*")
.pipe(VinylPaths(Del));
})
Gulp.task('copy:db', Gulp.series(clean, function () {
console.log('Copy DB');
return Gulp.src("./db/*")
.pipe(Gulp.dest("./dbSchema"));
}))
Gulp.task('default', Gulp.series(copy:db, function () {
console.log('defaulp');
return TypeScriptProject.src()
.pipe(TypeScriptProject())
.js.pipe(Gulp.dest('dist'));
}));
恕我直言,拥有三个完全独立的任务会更简单:
Gulp.task('clean', function () {
console.log('Clean');
return Gulp.src("./dbSchema/*")
.pipe(VinylPaths(Del));
});
Gulp.task('copy:db', function () {
console.log('Copy DB');
return Gulp.src("./db/*")
.pipe(Gulp.dest("./dbSchema"));
});
Gulp.task('default', function () {
console.log('defaulp');
return TypeScriptProject.src()
.pipe(TypeScriptProject())
.js.pipe(Gulp.dest('dist'));
});
然后使用以下任一方式调用它们:
Gulp.task('default', gulp.series(clean, copy:db, js));
或者
Gulp.task('default', gulp.series(clean, gulp.parallel(copy:db, js)));
希望有帮助:)
补充说明:
gulp/vars 的命名约定通常是驼峰式,例如:
gulp
而typeScriptProject
不是Gulp
orTypeScriptProject
。您可以使用以下方法完全消除编写的需要
gulp.
:var {gulp, task, src, dest, watch, series, parallel} = require('gulp');
exports
您可以使用 CommonJS模块表示法来声明任务,而不是直接定义您的任务,从而使您的代码更易于阅读。如果您在使用引号时保持一致,而不是混合单打和双打,那么生活会更轻松一些。两者都允许通配符
跟随 Gulp 自己的文档可能是开始的地方,他们在 github 上的示例代码有一些很好的例子来设置基本的 gulpfile。
如果你把所有这些都包起来,你会得到这个:
/*
* Example of requires with gulp methods also requiring gulp.
*/
var {
gulp,
dest,
series,
parallel,
src,
task,
watch
} = require('gulp'),
vinylPaths = require('vinyl-paths'), // may not be required, see note in clean func.
del = require('del'),
ts = require('gulp-typescript');
/*
* Added a basic TypeScript Project so the example is complete and could run.
*/
var typeScriptProject = ts.createProject({
declaration: true
});
/*
* Your tasks converted to plain/standard js functions.
*/
function clean () {
return src('dbSchema/*')
.pipe(vinylPaths(del));
// Looking at your example code the vinylPaths is redundant,
// as long as you’re using del ^2.0 it will return its promise,
// so you could replace the above with:
return del([ 'dbSchema' ]);
}
function copyDb () {
return src('db/*')
.pipe(dest('dbSchema'));
}
function scripts () {
// example src path
return src('lib/*.ts')
.pipe(typeScriptProject())
.pipe(dest('dist'));
}
/*
* By defining all the tasks separately it makes it really clear how the tasks will run.
*/
var build = gulp.series (
clean,
gulp.parallel (
copyDb,
scripts
)
);
/*
* Example of using `exports` module notation to declare tasks.
*/
exports.clean = clean;
exports.copyDb = copyDb;
exports.scripts = scripts;
exports.build = build;
/*
* Good practise to define the default task as a reference to another task.
*/
exports.default = build;
推荐阅读
- terraform - 如何在不推送到远程的情况下在本地测试 terraform 模块?
- asp.net - .NET Identity Token 无效,机器密钥相同
- python-3.x - 当我使用 python 从 CSV 文件中提取具有特定关键字的数据时,为什么会出现 KeyError?
- reactjs - 重新加载 React Router 应用程序时出现 404 错误
- ruby-on-rails - 在 Rails 5 中创建嵌套资源
- android - 如何判断变量是否在 kotlin 中初始化?
- javascript - JavaScript 中的 DOMParser 不提供 XML 元素
- javascript - JavaScript 用元素填充页面后,如何使用 Jsoup 从 URL 中提取 DOM?
- angular - 从代码中以特定格式日期显示日期?
- php - 带有 Slim 框架的 Nginx - 下载 php 文件