Modules imports for side effects from barrel files are not included in bundle

Bug report

What is the current behavior?

I have a index.ts which imports 2 modules (abstract-control.ts and abstract-control.directive.ts) for side effects, and exports another module (custom-control-status.directive.ts) therefore also acting as a barrel file. custom-control-status.directive.ts is imported through the barrel file (index.ts), therefore I thought index.ts and the 2 modules imported for side effects would be included in the bundle, but they’re removed in the tree shaking process. Despite specifying index.ts, abstract-control.ts and abstract-control.directive.ts in my package.json’s "sideEffects", they are all excluded from the bundle. The current workaround is to not use barrel files, meaning to import abstract-control.ts, abstract-control.directive.ts and custom-control-status.directive.ts directly in app.module.ts.

If the current behavior is a bug, please provide the steps to reproduce.

Repro repository: https://github.com/amitbeck/ng-webpack-sideEffects-repro Either:

1. Run npm run build, or
2. Run npm run serve and access through http://localhost:4200

The contents of abstract-control.ts, abstract-control.directive.ts and index.ts in src/app/utils/forms/ are not included in the bundle, and you therefore the side effects will not be performed. You should get the following runtime error:

TypeError: this.formGroup.controls.text.setWarnings is not a function.

What is the expected behavior?

The contents of abstract-control.ts and abstract-control.directive.ts should be included in the bundle, and the side effects should be performed. No runtime errors should occur.

Other relevant information: webpack version: 5.67.0 Node.js version: 16.13.1 Angular version: 13.2.7 Operating System: macOS Monterey 12.4

My SO question https://github.com/webpack/webpack/issues/15610#issuecomment-1138473225 According to an Angular team member, it seems to be a webpack issue: https://github.com/angular/angular-cli/issues/23246#issuecomment-1141113638

[vankop]

I created an issue

[vankop]

yeah, issue should be solved by preventing removing reexport. webpack@5 can handle reexport, so instead of

import * as i2 from "./utils/forms/custom-control-status.directive";

should be

import * as i2 from "./utils/forms"; // or another form of importing "./index"