时间戳

首页 > 解决方案 > webpack 中的模块 ID 不一致

webpack - webpack 中的模块 ID 不一致

问题描述

我刚刚将 Aurelia 应用程序从 SystemJS 切换到 Webpack。我收到一个错误，抱怨加载程序找不到的 moduleId。深入研究后，我发现 Webpack 以不一致的方式生成 ID。虽然通常 moduleId 的外观并不重要，但这里的错误是由 Aurelia 期望 View (HTML) 和 ViewModel (JS) 的 ID 匹配引起的。通常，如果您正确命名它们，它们会这样做。但是，出于某种原因，在这个项目中，Webpack 会为某些 View/ViewModel 组合生成不一致的 moduleId。例如我得到

contacts/persons/person-details and contacts/persons/person-details.html

分别用于 JS 和 HTML，这就是它应该的样子。但是对于一个基本相同的模块，我得到

hriS and contacts/companies/company-details.html

或使用moduleIds: 'named'（注意前导./src/和尾随.js）：

./src/contacts/companies/company-details.js and contacts/companies/company-details.html

为什么我会得到不一致的 ID？我不知道这是否是Aurelia loader plugin的 Webpack 本身的问题。

解决方法：您可以使用 Aurelia 强制模块 ID 使用PLATFORM.moduleName(). 因此，对于使用 Dialogs 而不是直接使用 ViewModel 的示例，您可以执行以下操作：

this.dialogService.open({ viewModel: PLATFORM.moduleName('contacts/companies/company-detail') });

标签： webpackaurelia

解决方案

PLATFORM.moduleName 不是可选的解决方法，而是要求。如果您查看 aurelia 指南 ( http://aurelia.io/docs/build-systems/webpack/a-basic-example#platformmodulename ) 中的 webpack 部分，您会看到：

From your application's perspective, there is also one important detail: 
each module reference must be wrapped in PLATFORM.moduleName(...).
This allows aurelia-loader-webpack to translate Aurelia's conventions
to something Webpack understands.

希望这能回答你的问题。

此致。

推荐阅读