babel-plugin-angular2-annotations
A babel transformer plugin for Angular 2 decorators and type annotations.
Use babel-plugin-transform-decorators-legacy to support decorators.
Make sure to load reflect-metadata for browser in order to polyfill Metadata Reflection API in your app.
Supported decorators/annotations
babel-plugin-transform-decorators-legacy)
Even without this plugin (thanks to-
Class decorators
@{} -
Class property decorators with initializers
@@ foo = ;`}
With this plugin
-
Type annotations for constructor parameters
{thisfoo = foo;thisbar = bar;}- Generic types are ignored as same as in TypeScript e.g.
QueryList<RouterLink>
is treated asQueryList
- Generic types are ignored as same as in TypeScript e.g.
-
Class property decorators with no initializer
@@ bar; -
Decorators for constructor parameters
@{thisname = name;thisoptional = optional;}
Install
npm install --save-dev babel-plugin-angular2-annotations
npm install --save-dev babel-plugin-transform-decorators-legacy babel-plugin-transform-class-properties babel-plugin-transform-flow-strip-types babel-preset-es2015
.babelrc
Example
Before:
@ baz; { }
After:
@ baz = thisbaz; HelloComponent null 1;Reflect;
See babel-angular2-app or angular2-esnext-starter for more complete example.