Build Angular 2 app with Babel
A skeleton Angular 2 app built with Babel and Browserify.
- Uses Babel instead of TypeScript/Traceur.
- Supports class/parameter decorators and parameter type annotations with Babel, babel-plugin-transform-decorators-legacy and babel-plugin-angular2-annotations.
- Bundles JavaScript files into one file with Browserify. (However, it doesn't use any Browserify-specific technology. You can easily switch to Webpack and etc.)
Try
Install
Clone/fork this repo and:
npm install
Build
Build once:
npm run build
Watch files and rebuild:
npm run watch
# or
npm start
Preview
npm install -g http-server
http-server public
Test
Unit and e2e tests:
npm test
Unit tests:
npm run unit
e2e tests:
npm run e2e
Motivation
Back in the time of angular2 alpha.18, angular/quickstart
provided us to try Angular 2 app with on-the-fly transpilation and lazy-loading, which resulted in long waiting time for each file change. Also, I was not familiar with the Traceur tool stack and its output. angular2 npm package said The files under /es6 are es6 compatible files that can be transpiled to es5 using any transpiler. So I gave it a shot.
Babel transformer plugin
To support type annotation, parameter decorator and property decorator without initializer, this skeleton app uses the following external Babel transform plugin that I made: