Nx 和 Angular 中的模块联合在加载 styles.js 时生成错误

Question

我正在关注描述设置模块联合的文章：https ://nx.dev/l/a/guides/setup-mfe-with-angular

从生成工作区开始，添加角度插件，然后添加仪表板应用程序。

在提供仪表板应用程序时，我从 styles.js 收到错误：

 Uncaught SyntaxError: Cannot use 'import.meta' outside a module

它正在加载为：

<script src="styles.js" defer></script>

进行一些快速搜索似乎表明这个东西应该有 type="module" 。

然而，我似乎找不到任何类型的配置来修改添加到index.html 的行。

我已经检查了 Angular 生成的常规模板，它对所有内容都使用 defer 样式，因此其他 js 文件条目在某个地方被更改为 type="module" 。普通的 styles.js 也不包含任何“import.meta”字符串。

任何解决方案都会有帮助。

Answer 1

TL;DR：那很好。您不应该在生产中看到此错误

您提到的 https://nx.dev/guides/setup-mfe-with-angular 上有一条注释：

注意：在本地以开发模式提供 MFE 时，控制台会输出错误，import.meta 不能在模块外部使用，并且来自 styles.js 的脚本。这是一个已知的错误输出，但据我们的测试显示，它实际上不会导致任何损坏。这是因为 Angular 编译器将 styles.js 文件附加到带有 defer 的标签中的 index.html 中。它需要附加 type=module，但这样做会破坏 HMR。我们无法挂钩该过程并自行修补它。好消息是该错误不会传播到生产环境，因为样式被编译为 CSS 文件，因此不会有错误的 JS 记录错误。值得重申的是，我们的测试中没有发现任何实际错误或损坏。