angular / angular-cli

CLI tool for Angular
https://cli.angular.io
MIT License
26.73k stars 11.98k forks source link

Decorator metadata missing in production build #28155

Open bagbag opened 1 month ago

bagbag commented 1 month ago

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

compiler-cli, compiler

Is this a regression?

Yes

Description

Decorator metadata like "design:type" is missing in production builds, while working in development.

Having the following code:

export class MyClass {
  @Property()
  address: string;
}

Compiles the to the following in development:

var MyClass = class {
}
;
__decorate20([Property16(), __metadata20("design:type", String)], MyClass.prototype, "address", void 0);

But to the following in production build:

var Nr = class {
}
;
r([t()], Nr.prototype, "address", 2),

The information about the property address being of type String is missing.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

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

Angular CLI: 18.1.3
Node: 22.5.1
Package Manager: npm 10.8.2
OS: linux x64

Angular: 18.1.3
... animations, build, cdk, cli, common, compiler, compiler-cli
... core, forms, platform-browser, platform-browser-dynamic
... router, service-worker

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1801.3
@angular-devkit/core         18.1.3
@angular-devkit/schematics   18.1.3
@schematics/angular          18.1.3
rxjs                         7.8.1
typescript                   5.5.4

Anything else?

No response

JeanMeche commented 1 month ago

Hi, could you provide a stackblitz repro or a github repo that exhibits this issue ?

bagbag commented 1 month ago

I've created a minimal reproduction: https://github.com/bagbag/angular-decorator-metadata

If you start the application with ng serve, you will see Design type: String If you start the application with ng serve --configuration production, you will see Could not get design type, as the decorator metadata is not added to the compiled output.

While trying to reproduce this problem I found out, that it only occurs if isolatedModules is set to true in tsconfig.

JeanMeche commented 1 month ago

It looks like to be linked to #27752.

Esbuild doesn't generate those metadata.

JoostK commented 1 month ago

It looks like to be linked to #27752.

Esbuild doesn't generate those metadata.

Yeah, I suppose the CLI should not use this mode when emitDecoratorMetadata is enabled.

That said, I wouldn't want to depend on this metadata going forward, as it's currently only supported for the experimental decorators in TS, not the ES standard ones. reference

clydin commented 1 month ago

Additionally, emitDecoratorMetadata itself has design flaws that can cause it to generate runtime TDZ errors in ES2015+ code. All code generated by the Angular CLI is ES2015+. Angular does not require the use of the option and unless absolutely required by specific project code, the option should ideally be removed.