Skip to content

Commit

Permalink
docs: describe how to configure CommonJS modules (angular#37331)
Browse files Browse the repository at this point in the history
In version 10, we have a new option for the `angular.json` file,
`allowedCommonJsDependencies`, so users can opt in to support
CommonJS modules.

PR Close angular#37331
  • Loading branch information
David Shevitz 🔵 authored and profanis committed Sep 5, 2020
1 parent 8d0faf6 commit 4a9375e
Showing 1 changed file with 27 additions and 0 deletions.
27 changes: 27 additions & 0 deletions aio/content/guide/build.md
Expand Up @@ -262,6 +262,33 @@ Each budget entry is a JSON object with the following properties:

</table>

{@a commonjs }
## Configuring CommonJS dependencies

<div class="alert is-important">

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/).

</div>

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.

<code-example lang="json">
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"allowedCommonJsDependencies": [
"lodash"
]
...
}
...
},
</code-example>

{@a browser-compat}

Expand Down

0 comments on commit 4a9375e

Please sign in to comment.