临界依赖(Critical dependency):依赖的请求是一个表达式

Question

在ng build (Angular 12)之后，我收到了这些警告:

./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:35289:13-34 - Warning: Critical dependency: the request of a dependency is an expression

./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:35301:13-100 - Warning: Critical dependency: the request of a dependency is an expression

我使用@angular-builders/custom-webpack从初始包中提取moment.js。

如果我禁用了@angular-builders/custom-webpack，那么一切正常，警告也会消失。

此外，如果我在custom-webpack.config.js中添加以下内容，警告就会消失:

new webpack.ContextReplacementPlugin(
/@angular(\|/)core(\|/)__ivy_ngcc__(\|/)fesm2015/,
path.join(__dirname, './src'),
{}
),

那么，究竟是什么导致了这些警告?有没有其他的解决方案来处理它，而不像上面那样在webpack配置中添加插件?谢谢。

Answer 1

我从Angular开发团队那里得到了以下反馈:

这来自已弃用的SystemJsNgModuleLoader中的代码，并且是通常在使用CLI构建器时被抑制，其中还使用ContextReplacementPlugin。我觉得没有别的办法了压抑它们，除了不压抑它们和忽略它们警告。

https://github.com/angular/angular/issues/43092 issuecomment - 895848535

所以我最终在custom-webpack.config.js中使用了下面提到的CLI构建器代码:

// Always replace the context for the System.import in angular/core to prevent warnings.
new ContextReplacementPlugin(
/@angular(\|/)core(\|/)/,
path.join(__dirname, '$_lazy_route_resources'),
{}
),

Answer 2

在Angular 12中使用自定义ContextReplacementPlugin时，请注意:

如果在您的自定义配置中指定了一个已经存在的插件如果是由Angular CLI添加的，那么默认情况下这两个实例会被合并。

我使用了ContextReplacementPlugin来排除moment.js的区域设置。在升级到Angular 12之后，所有的区域设置都被删除了，因为它的配置被合并到$_lazy_route_resources中。我通过将replaceDuplicatePlugins设置为true来解决这个问题。