RequireJS 包在优化器中失败 - “模块共享相同的 URL”

Question

tl;博士

RequireJS 优化器不喜欢我在模块上定义包定义，但如果我不定义包，也找不到模块。

长版

尝试使用 requirejs 优化器时出现以下错误：

Error: Module loading did not complete for: scripts/simulation.bundle, app_mini, testservice
   The following modules share the same URL. This could be a misconfiguration if that URL only has one anonymous module in it:
   .../web/dist/scripts/app.bundle.js: app_mini, testservice

我实际上是在使用 grunt-contrib-requirejs 来优化我的生产环境的 js 脚本。在添加simulator.bundle之前一切正常

我有 3 个捆绑包：

• app.bundle（主包）
• simulation.bundle
• vendor.bundle

这是 requirejs grunt 任务的 modules 选项

[{
    name: 'scripts/vendor.bundle',
    exclude: [],
    override: {
      paths: {
        angular: 'bower/angular/angular',
        jquery: 'bower/jquery/dist/jquery',
        ngRoute: "bower/angular-route/angular-route"
      },
      shim: {
        angular: {
          exports: 'angular',
          deps: ['jquery'] // make jquery dependency - angular will replace jquery lite with full jquery
        },
        bundles: {
          'scripts/app.bundle': ['app_mini', 'testservice'],
        },
      }
    }
  },
  {
    name: 'scripts/simulation.bundle',
    exclude: [],
    override: {
      paths: {},
      shim: {},
      bundles: {
        'scripts/vendor.bundle': ['angular', 'jquery'],
        'scripts/app.bundle': ['app_mini', 'testservice']
      }
    }
  },
  {
    name: 'scripts/app.bundle',
    exclude: ['scripts/vendor.bundle'],
    override: {
      paths: {
        app_mini: 'scripts/app.mini',
        testservice: 'scripts/features/test.service'
      },
      shim: {},
      bundles: {
        'scripts/vendor.bundle': ['angular', 'jquery']

      }
    }
  }
]

simulation.bundle 中的捆绑包似乎是问题所在。但是，如果我删除它们，则找不到文件：

>> Error: ENOENT: no such file or directory, open
>> '...\web\dist\app_mini.js'
>> In module tree:
>>     scripts/simulation.bundle

simulation.bundle 只是一个虚拟模块，加载了angular 和app_mini：

define(['app_mini', 'angular'], function(app_mini, angular) {
    // nothing here
}

因此，无论哪种方式，优化器都无法处理依赖关系。我必须如何对其进行配置才能使其正常工作？

Answer 1

好吧，我再次发布我自己问题的答案，我希望其他人能从我的错误中受益；）

所以我发现的是：

Bundle 配置仅适用于 requireJS，不适用于优化器！

我在配置中定义的捆绑包导致模块共享相同 url 的错误。

正确的做法是为所有模块定义所有路径，并按名称明确排除不应包含在模块中的模块。

例如，app_mini 应该进入app.bundle，但是因为它在simulation.bundle 中是必需的，所以它会被包含在其中，因为排除app.bundle 尚不可能（目前尚未优化点），我们需要直接排除app_mini。

所以一个有效的配置应该是这样的：（未测试）

paths: {
    angular: 'bower/angular/angular',
    jquery: 'bower/jquery/dist/jquery',
    ngRoute: "bower/angular-route/angular-route"
    app_mini: 'scripts/app.mini',
    testservice: 'scripts/features/test.service'
},
shim: {
    angular: {
        exports: 'angular',
        deps: ['jquery'] // make jquery dependency - angular will replace jquery lite with full jquery
    }
},

modules: [
    {
        name: 'scripts/vendor.bundle',
        exclude: [],
    },
    {
        name: 'scripts/simulation.bundle',
        exclude: [`app_mini`],
    },
    {
        name: 'scripts/app.bundle',
        exclude: ['scripts/vendor.bundle'],
    }
}]