-
Couldn't load subscription status.
- Fork 11.9k
Description
🐞 Bug report
Command (mark with an x)
- new
- build
- serve
- test
- e2e
- generate
- add
- update
- lint
- extract-i18n
- run
- config
- help
- version
- doc
Is this a regression?
I don't think so
Description
When you import a third party dependecy that uses private class fields (Native private class features), they end up being inserted into the constructor before the super() call.
🔬 Minimal Reproduction
- Create a new Angular project
- Add a third party library that uses private class fields (
npm install [email protected]) - Import the library (
import 'scrollable-component';inside yourmain.ts) - Build the project (
ng buildorng serve --configuration production,optimizationshould be set totrueinside yourangular.json) - The generated code is incorrect
(here is the third party imported file)
🔥 Exception or Error
Uncaught ReferenceError: must call super constructor before using 'this' in derived class constructor
vendor.js
🌍 Your Environment
@angular-devkit/architect 0.1301.3
@angular-devkit/build-angular 13.1.3
@angular-devkit/core 13.1.3
@angular-devkit/schematics 13.1.3
@angular/cli 13.1.3
@schematics/angular 13.1.3
rxjs 7.5.2
typescript 4.5.4
Anything else relevant?
The bug only occurs when your build configuration contains the "optimization": true (or does not contain the "optimization": false) rule, which is the default for the production configuration.
From what I can understand, something like this happens:
// Before optimization
class Test extends HTMLElement {
#privateField;
constructor() {
super();
}
}// After optimization
class Test extends HTMLElement {
constructor() {
__definePrivateField(this, privateField);
super();
}
}I found this issue evanw/esbuild#1918 which may be related and tried several options in my tsconfig.json, like:
"target": "esnext""module": "esnext"
but I haven't been able to make it work (the problem also occurs with private class methods).