Skip to content

Transitive dependencies hoisted by rollup cause warnings when importing libraries with multiple chunks #28221

Closed
ng-packagr/ng-packagr
#2903

Description

Which @angular/* package(s) are the source of the bug?

compiler

Is this a regression?

Yes

Description

In a project that has large parts split off into libraries (ng g lib), building the main application (which imports those libraries) I am drowned in a huge amount of warnings about imports being ignored because their packages are marked as having no side effects, e.g.:

▲ [WARNING] Ignoring this import because "dist/sioux/app/fesm2022/sioux-app.mjs" was marked as having no side effects [ignored-bare-import]

    dist/sioux/admin/fesm2022/sioux-admin-acl-editor.component-CbLkugjk.mjs:21:7:
      21 │ import '@sioux/app';
         ╵        ~~~~~~~~~~~~

  "sideEffects" is false in the enclosing "package.json" file:

    dist/sioux/app/package.json:59:2:
      59 │   "sideEffects": false
         ╵   ~~~~~~~~~~~~~

What appears to be happening is that rollup splits the library into multiple chunks and, while doing so, hoists transitive imports. An explanation of the background can be found here: https://rollupjs.org/faqs/#why-do-additional-imports-turn-up-in-my-entry-chunks-when-code-splitting

Apparently, it should be possible to prevent this hoisting by configuring the hoistTransitiveImports option for rollup: https://rollupjs.org/configuration-options/#output-hoisttransitiveimports

Yet, it appears that Angular won't let me add any custom configuration options for rollup. So, I wonder if hoisting of transitive imports shouldn't be disabled by default when building libraries in order to avoid these unnecessary warnings.

Unfortunately, I fail to produce a minimal example of a library that would be split into chunks and have its imports hoisted.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

▲ [WARNING] Ignoring this import because "dist/sioux/app/fesm2022/sioux-app.mjs" was marked as having no side effects [ignored-bare-import]

    dist/sioux/admin/fesm2022/sioux-admin-acl-editor.component-CbLkugjk.mjs:21:7:
      21 │ import '@sioux/app';
         ╵        ~~~~~~~~~~~~

  "sideEffects" is false in the enclosing "package.json" file:

    dist/sioux/app/package.json:59:2:
      59 │   "sideEffects": false
         ╵   ~~~~~~~~~~~~~

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 17.3.3
Node: 20.12.2
Package Manager: npm 10.5.0
OS: linux x64

Angular: 17.3.3
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, language-service, localize, material
... platform-browser, platform-browser-dynamic, router
... service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1700.5
@angular-devkit/build-angular   17.3.3
@angular-devkit/core            17.0.5
@angular-devkit/schematics      17.3.3
@schematics/angular             17.3.3
ng-packagr                      17.3.0
rxjs                            7.8.1
typescript                      5.4.4
zone.js                         0.14.4

Anything else?

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions