diff --git a/aio/content/guide/build.md b/aio/content/guide/build.md index f9e607d616..91c8e2c8e8 100644 --- a/aio/content/guide/build.md +++ b/aio/content/guide/build.md @@ -262,6 +262,33 @@ Each budget entry is a JSON object with the following properties: +{@a commonjs } +## Configuring CommonJS dependencies + +
+ +It is recommended that you avoid depending on CommonJS modules in your Angular applications. +Depending on CommonJS modules can prevent bundlers and minifiers from optimizing your application, which results in larger bundle sizes. +Instead, it is recommended that you use [ECMAScript modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) in your entire application. +For more information, see [How CommonJS is making your bundles larger](https://web.dev/commonjs-larger-bundles/). + +
+ +The Angular CLI outputs warnings if it detects that your browser application depends on CommonJS modules. +To disable these warnings, you can add the CommonJS module name to `allowedCommonJsDependencies` option in the `build` options located in `angular.json` file. + + +"build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "allowedCommonJsDependencies": [ + "lodash" + ] + ... + } + ... +}, + {@a browser-compat}