Angular 10升级-修复CommonJS或AMD依赖项可能会导致优化援助

Question

我正在尝试将Angular 9应用程序升级到Angular 10版本，但是升级后却出现警告

WARNING in calendar.reducer.ts depends on lodash/keys. CommonJS or AMD dependencies can cause optimization bailouts.

我已将以下行添加到我的angular.json文件中，但问题未解决

"allowedCommonJsDependencies": ["lodash"]

如何解决以上问题。

Answer 1

npm软件包lodash本身不是ECMAScript模块，因此会产生警告。 有多种解决方法：

替换为ES调制库（推荐）

某些库提供ES调制的版本。对于lodash，您可以将其替换为lodash-es。

运行npm install --save lodash-es。

现在将所有从lodash的导入替换为lodash-es。

还要确保使用ES导入语句导入库：

import { keys } from 'lodash-es';

将CommonJS依赖项列入白名单

如果您的库中没有可用的ES调制版本，或者由于某种原因您不在乎，则可以在angular.json文件中添加可以允许特定CommonJS依赖项的内容：

"architect": {
  "build": {
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      "allowedCommonJsDependencies": ["lodash"]
    }
  }
}

自Angular CLI版本10.0.1起，您可以在allowedCommonJsDependencies中使用glob。 这意味着，如果您传递lodash，则也将允许子路径（例如lodash/keys）。