在通过gulp-submodule注入依赖项的模块上运行gulp任务,而该模块又通过gulp-submodule拥有自己的依赖项,失败

时间:2017-03-28 05:04:04

标签: javascript node.js gulp

标题可能听起来有点模糊,但这里有一个出错的例子。假设我们有三个模块 ModuleA ModuleB ModuleC ,因此 ModuleA 依赖于 ModuleB < / em>和 ModuleB 取决于 ModuleC 。当我们需要针对 ModuleA 运行任务时,我们经常还需要针对其依赖项运行一些任务 - ModuleB ModuleC ,这里是gulp -submodule发挥作用。 Gulp-submodule让我们定义依赖模块的任务与其依赖关系之间的依赖关系,以便依赖模块的任务触发其依赖关系的适当任务。

如果我们有一个扁平结构,那么这很好用,即 SomeModule 依赖于一堆没有自己依赖的其他模块。但是,一旦这些依赖项中的任何一个具有自己的依赖关系,整个生态系统就会破坏一条模糊的错误消息,告知gulp无法找到某个任务。

这是演示代码。要在本地环境中对此进行测试,必须至少安装gulp作为全局程序包,并将gulp和gulp-submodule安装为项目的本地程序包。

模块a.gulpfile.js

const gulp = require("gulp");
require("gulp-submodule")(gulp);

gulp.submodule("module-b", {filepath: "module-b.gulpfile.js"});

gulp.task("default", ["module-b:default"], () => {
    console.log("Running task 'default' for module 'module-a'...");
});

模块b.gulpfile.js

const gulp = require("gulp");
require("gulp-submodule")(gulp);

gulp.submodule("module-c", {filepath: "module-c.gulpfile.js"});

gulp.task("default", ["module-c:default"], () => {
    console.log("Running task 'default' for module 'module-b'...");
});

模块c.gulpfile.js

const gulp = require("gulp");

gulp.task("default", [], () => {
    console.log("Running task 'default' for module 'module-c'...");
});

在module-a.gulpfile.js上运行任务'default'后,您会得到类似于此的输出:

  

gulp --gulpfile module-a.gulpfile.js
  [07:15:27]使用gulpfile module-a.gulpfile.js
  [07:15:27]任务'module-b:module-c:default'不在你的gulpfile中   [07:15:27]请查看文档以了解正确的gulpfile格式

正如人们可能注意到的那样,gulp正在寻找一个名为'module-b:module-c:default'的特定任务,尽管在任何项目文件中都没有定义或引用具有此类名称的任务。

1 个答案:

答案 0 :(得分:2)

这个奇怪的不存在的任务来自gulp-submodule处理模块和任务之间的依赖关系的方式。简单来说,它执行以下操作:

  1. 首先,在此调用gulp.submodule("module-b", {filepath: "module-b.gulpfile.js"}) gulp-submodule暂时替换原始gulp.task并将指定的gulpfile作为模块加载。
  2. 当加载gulpfile时,它获取gulp的修改实例,其中task方法通过在模块名称和分隔符(默认为“:”)前面添加它来修改作为其参数提交的任务的名称。
  3. 后来,当gulp运行模块'module-a'的任务'default'时,它会遇到我们引用为“module-b:default”的依赖项,这正是为任务'default'构造的特殊名称''模块'模块-b'在步骤2中。
  4. 有多个级别的依赖层次结构,这个简单的逻辑会中断,因为从module-b.gulpfile.js调用gulp.submodule("module-c", {filepath: "module-c.gulpfile.js"})会导致gulp.task被包装  第二次通过gulp-submodule,因此模块'module-c'的任务'default'的名称前置两次:首先使用'module-c'然后使用'module-b'。

    为了快速解决这个问题,我已经向原始子模块的私人提交了一个快捷方式修补程序:5864ae5gulp-submodule)。这只是一个快速修复,绝对不是最好的,但它为我做了诀窍。我将更新这个答案,我是否可以为这个问题提供更可靠的解决方案。