https://github.com/jetbrains/babel-plugin-angular-annotate
Make angular dependency annotation minification proof
https://github.com/jetbrains/babel-plugin-angular-annotate
angular babel-plugin jetbrains-ui
Last synced: 6 months ago
JSON representation
Make angular dependency annotation minification proof
- Host: GitHub
- URL: https://github.com/jetbrains/babel-plugin-angular-annotate
- Owner: JetBrains
- Fork: true (marcioj/babel-plugin-angular-annotate)
- Created: 2017-01-25T11:26:14.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2019-08-07T23:02:53.000Z (over 6 years ago)
- Last Synced: 2024-04-13T12:06:50.240Z (almost 2 years ago)
- Topics: angular, babel-plugin, jetbrains-ui
- Language: JavaScript
- Homepage:
- Size: 144 KB
- Stars: 3
- Watchers: 12
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# babel-plugin-angular-annotate
> Make angular dependency annotation minification proof
[![Build Status][travis_badge]][travis]
## Compatibility
The version 2.x uses babel 6.x plugin API, for babel 5.x versions use the babel-plugin-angular-annotate 1.x
## Installation
```sh
npm install babel-plugin-angular-annotate
```
## Usage
### Via `.babelrc` (Recommended)
**.babelrc**
```js
{
"plugins": [
["angular-annotate", [configurations...]]
]
}
```
### Via CLI
```sh
$ babel --plugins angular-annotate script.js
```
### Via Node API
```javascript
require("babel-core").transform("code", {
plugins: [
["angular-annotate", [configurations...]]
]
});
```
## Known issues
- Some injections wont work properly when using this plugin in conjuction with `babel-preset-es2015`. To get it working you need to use `"passPerPreset": true` in your `.babelrc`.
## Configuration
`angular-annotate` accepts a json like injection configuration starting with an array containing two items in this format: `[method call, args]`.
`method call` is expressed as a string with the service name and method call. For instance `"$injector.invoke"`.
You can also nest calls. For instance: `"$httpProvider.interceptors.push"`.
`args` is where you map each param with the corresponding injection strategy. The two possible are: `"$injectFunction"` and `"$injectObject"`.
Any other value will be ignored.
`$injectFunction` will transform:
```js
function (a, b, c) {
}
```
to
```js
['a', 'b', 'c', function (a, b, c) {
}]
```
For instance to create a rule for `$injector.invoke` you can apply the following configuration: `["$injector.invoke", ["$injectFunction"]]`.
So the following will be transformed:
Before:
```js
$injector.invoke(function($state) {
$state.go('somewhere');
});
```
After:
```js
$injector.invoke(['$state', function($state) {
$state.go('somewhere');
}]);
```
`$injectObject` will apply `$injectFunction` for each object value. This is mainly used in the `resolve` property from some services. For example:
The `$routeProvider.when` configuration can be expressed with the following:
```json
["$routeProvider.when", ["_", {
"controller": "$injectFunction",
"resolve": "$injectObject"
}]];
```
Before:
```js
$routeProvider.when('/foo', {
controller: function($scope) {
$scope.message = 'foo';
},
templateUrl: 'foo.html',
resolve: {
store: function (foo) {
}
}
});
```
After:
```js
$routeProvider.when('/foo', {
controller: ['$scope', function($scope) {
$scope.message = 'foo';
}],
templateUrl: 'foo.html',
resolve: {
store: ['foo', function (foo) {
}]
}
});
```
Note that since we don't want to do anything in the routeName we use a `"_"` to ignore it.
### Presets
Since configuring each service injection can be tedius, this libray includes some presets like: `"angular", "ngMaterial", "ngRoute" and "ui.router"`.
So you can simple include the following in .babelrc:
```json
{
"plugins": [
["angular-annotate", ["angular", "ngMaterial", "ui.router"]]
]
}
```
Check the [main file](./src/index.js) to see what injections are currently handled.
## Running Tests
`npm test`
## Contributing
1. Fork it
1. Create your feature branch (`git checkout -b my-new-feature`)
1. Commit your changes (`git commit -am 'Add some feature'`)
1. Push to the branch (`git push origin my-new-feature`)
1. Create new Pull Request
[travis]: https://travis-ci.org/marcioj/babel-plugin-angular-annotate
[travis_badge]: https://api.travis-ci.org/marcioj/babel-plugin-angular-annotate.svg?branch=master