使用 broccoli-requirejs 从同一棵树构建两个不同的文件时出错

Error building two different files from same tree with broccoli-requirejs

我正在尝试使用 broccoli-requirejs 编译两个不同的 JS 文件。一个合乎逻辑的方法似乎是 运行 我的脚本树上的 requireJs 过滤器两次,具有两种不同的配置。这样做会产生一些非常奇怪的错误,对我来说,类似于竞争条件或其他东西。

请参阅下面的 Broccoli 配置和错误输出。

var compileCoffee = require("broccoli-coffee"),
    compileStatic = require("broccoli-static-compiler"),
    mergeTrees    = require("broccoli-merge-trees"),
    requireJs     = require("broccoli-requirejs"),
    _             = require("lodash");

var scripts = compileStatic("app/coffee", {
    srcDir: "/",
    destDir: "scripts"
});
scripts = compileCoffee(scripts, {bare: true});

var rjsOptions = {
    baseUrl: "scripts",
    inlineText: true,
    optimize: "uglify",
    stubModules: ["text"],
    paths: {
        knockout: "empty:"
    }
};

var fooScript = requireJs(scripts, {
    requirejs: _.extend(rjsOptions, {
        include: ["foo"],
        insertRequire: ["main"],
        mainConfigFile: "scripts/main.js",
        name: "main",
        out: "scripts/main.js"
    })
});

var barScript = requireJs(scripts, {
    requirejs: _.extend(rjsOptions, {
        insertRequire: ["bar"],
        mainConfigFile: "scripts/main.js",
        name: "bar",
        out: "scripts/bar.js"
    })
});

module.exports = mergeTrees([
    fooScript,
    barScript
]);

构建时出现以下错误:

$ broccoli build build
Error: Merge error: file scripts/bar.js exists in /home/fredrik/app/tmp/require_js_filter-tmp_dest_dir-yMHQNi3F.tmp and /home/fredrik/app/tmp/require_js_filter-tmp_dest_dir-C8Wv970J.tmp
Pass option { overwrite: true } to mergeTrees in order to have the latter file win.
  at mergeRelativePath (/home/fredrik/app/node_modules/broccoli-merge-trees/index.js:98:21)
  at mergeRelativePath (/home/fredrik/app/node_modules/broccoli-merge-trees/index.js:122:17)
  at /home/fredrik/app/node_modules/broccoli-merge-trees/index.js:23:5
  at $$$internal$$tryCatch (/home/fredrik/app/node_modules/broccoli-merge-trees/node_modules/promise-map-series/node_modules/rsvp/dist/rsvp.js:490:16)
  at $$$internal$$invokeCallback (/home/fredrik/app/node_modules/broccoli-merge-trees/node_modules/promise-map-series/node_modules/rsvp/dist/rsvp.js:502:17)
  at $$$internal$$publish (/home/fredrik/app/node_modules/broccoli-merge-trees/node_modules/promise-map-series/node_modules/rsvp/dist/rsvp.js:473:11)
  at Object.$$rsvp$asap$$flush [as _onImmediate] (/home/fredrik/app/node_modules/broccoli-merge-trees/node_modules/promise-map-series/node_modules/rsvp/dist/rsvp.js:1581:9)
  at processImmediate [as _immediateCallback] (timers.js:345:15)


Build failed

如果我确实将 {overwrite: true} 传递给 mergeTrees 调用,我会得到第一个 requireJs 调用的输出(即 scripts/main.js),但是文件名 bar.js.

看来我的问题与 Broccoli 和 broccoli-requirejs 完全无关。是我对 _.extend 的调用覆盖了 rjsConfig 对象。由于在合并树之前不会发生配置对象的实际 r.js 优化,因此第二次 _.extend 调用的结果被传递了两次。

只需更改传递给 _.extend 的参数的顺序即可使其按预期工作:

var fooScript = requireJs(scripts, {
    requirejs: _.extend({
        include: ["foo"],
        insertRequire: ["main"],
        mainConfigFile: "scripts/main.js",
        name: "main",
        out: "scripts/main.js"
    }, rjsOptions)
});