Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

docs: describe how to configure CommonJS modules #37331

Closed
wants to merge 1 commit into from
Closed

docs: describe how to configure CommonJS modules #37331

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
27 changes: 27 additions & 0 deletions aio/content/guide/build.md
View file
Open in desktop
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">
aikithoughts marked this conversation as resolved.
Show resolved Hide resolved
aikithoughts marked this conversation as resolved.
Show resolved Hide resolved

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>
aikithoughts marked this conversation as resolved.
Show resolved Hide resolved

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