Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/shuhei/babel-angular2-app
A super-simple skeleton Angular 2 app built with Babel and Browserify.
https://github.com/shuhei/babel-angular2-app
Last synced: 8 days ago
JSON representation
A super-simple skeleton Angular 2 app built with Babel and Browserify.
- Host: GitHub
- URL: https://github.com/shuhei/babel-angular2-app
- Owner: shuhei
- Archived: true
- Created: 2015-03-29T15:11:38.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-01-22T10:53:09.000Z (almost 8 years ago)
- Last Synced: 2024-08-01T20:36:31.655Z (3 months ago)
- Language: JavaScript
- Homepage:
- Size: 68.4 KB
- Stars: 259
- Watchers: 27
- Forks: 55
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-angular - babel-angular2-app - A super-simple skeleton Angular 2 app built with Babel and Browserify. (Uncategorized / Uncategorized)
README
# Build Angular 2 app with Babel
A skeleton [Angular 2](https://angular.io/) app built with [Babel](https://babeljs.io/) and [Browserify](http://browserify.org/).
- Uses Babel instead of [TypeScript](http://www.typescriptlang.org/)/[Traceur](https://github.com/google/traceur-compiler).
- Supports class/parameter decorators and parameter type annotations with [Babel](https://github.com/babel/babel), [babel-plugin-transform-decorators-legacy](https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy) and [babel-plugin-angular2-annotations](https://github.com/shuhei/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](https://www.npmjs.com/package/angular2) 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:
- [babel-plugin-angular2-annotations](https://github.com/shuhei/babel-plugin-angular2-annotations)
## License
[ISC](https://opensource.org/licenses/ISC)