emitDecoratorMetadata and its importance in transpiled code

Question

I am curious about the importance of the emitDecoratorMetadata option in transpiling TypeScript to JavaScript (in Angular 2 context). If set to false, and metadata will not be included in resulting code, what effect will it have?

Answer 1

The decorator metadata is needed if you want to reflect over the metadata at runtime.

If you are not doing this, for example with Reflect.metadata, there is no impact in excluding the output. By default, emitDecoratorMetadata is false. Decorators still work, but the design time information is not available at runtime.

Answer 2

Here, is a scenario I came across reading...

Injectors use metadata output by the TypeScript compiler, to determine what service types are being requested by component. The metadata outputs information about the number and type of parameters declared on methods.

The dependency injection system then can look at the constructor parameter metadata to figure out what types to inject.

All of this is enabled by the special TypeScript compiler options named

"emitDecoratorMetadata":true

that is usually configured in a tsconfig.json file.

If emitDecoratorMetadata is not set to true, Angular can't find out what to inject in your app.

If you create your application with the Angular CLI. This option is turned on (set to true) by default.

Metadata will only be emitted for a service or a component if the class has a decorator on it. It doesn't matter which decorator. Any decorator will cause metadata to be emitted. This is why we add Injectable() decorator to the services and we don't have to add it to the components since they already have the component decorator

Thus, injection system figures out what type to inject into the component constructor.