ng-annotate-patched v1.14.1
Fork details
ng-annotate-patched is a fork of ng-annotate.
ng-annotate is no longer maintained,
and hence fails when applied to source code containing modern JavaScript
constructs, like import
and export
.
This fork contains the following changes:
Renamed package and binary from
ng-annotate
tong-annotate-patched
.Updated the acorn JavaScript parser. ECMAScript 2020 mode is used by default.
Enabled some acorn options that allow it to parse a wider range of JavaScript.
Added a
acornOptions
option to the API, to allow overriding or passing extra options to acorn.Added support for ngInject in
export [default] function functionName() {...}
andexport [default] var varName = function [functionName]() {...}
.Added support for annotating ES6 classes with explicit
ngInject
annotations. The support may not be perfect yet. For more information please see ES6 test file.Added support for annotating arrow functions in most places where old-style function expressions are accepted.
Added support for parsing dynamic
import()
syntax. If you use Webpack or a similar module loader you would probably like to compile toesnext
modules for dynamic import support.Published to npm under the name
ng-annotate-patched
.
All work is done on the fork
branch. The master
branch corresponds to
the ng-annotate
commit the fork is based on.
Original README
ng-annotate adds and removes AngularJS dependency injection annotations.
Write your code without annotations and mark-up functions to be annotated
with the "ngInject"
directive prologue, just like you would
"use strict"
. This must be at the beginning of your function.
$ cat source.js
angular.module("MyMod").controller("MyCtrl", function($scope, $timeout) {
"ngInject";
...
});
Then run ng-annotate as a build-step to produce this intermediary, annotated, result (later sent to the minifier of choice):
$ ng-annotate -a source.js
angular.module("MyMod").controller("MyCtrl", ["$scope", "$timeout", function($scope, $timeout) {
"ngInject";
...
}]);
Your minifier will most likely retain the "ngInject"
prologues so use sed
or a regexp in your build toolchain to get rid of those on the ng-annotate output.
sed
example: ng-annotate -a source.js | sed "s/[\"']ngInject[\"'];*//g"
.
JavaScript regexp example: source.replace(/["']ngInject["'];*/g, "")
.
You can also use ng-annotate to rebuild or remove existing annotations. Rebuilding is useful if you like to check-in the annotated version of your source code. When refactoring, just change parameter names once and let ng-annotate rebuild the annotations. Removing is useful if you want to de-annotate an existing codebase that came with checked-in annotations
Installation and usage
npm install -g ng-annotate-patched
Then run it as ng-annotate OPTIONS <file>
. The errors (if any) will go to stderr,
the transpiled output to stdout.
The simplest usage is ng-annotate -a infile.js > outfile.js
.
See OPTIONS.md for command-line documentation.
ng-annotate can be used as a library, see OPTIONS.md for its API.
Implicit matching of common code forms
ng-annotate uses static analysis to detect common AngularJS code patterns. When
this works it means that you do not need to mark-up functions with "ngInject"
.
For a lot of code bases this works very well (use ng-strict-di
to simplify
debugging when it doesn't) but for others it is less reliable and you may prefer
to use "ngInject"
instead. For more information about implicit matching see
IMPLICIT.md.
Explicit annotations with ngInject
The recommended function foo($scope) { "ngInject"; ... }
can be exchanged
for /*@ngInject*/ function foo($scope) { ... }
or
ngInject(function foo($scope) { ... })
. If you use the latter form then
then add function ngInject(v) { return v }
somewhere in your codebase or process
away the ngInject
function call in your build step.
Suppressing false positives with ngNoInject
The /*@ngInject*/
, ngInject(..)
and "ngInject"
siblings have three cousins that
are used for the opposite purpose, suppressing an annotation that ng-annotate added
incorrectly (a "false positive"). They are called /*@ngNoInject*/
, ngNoInject(..)
and "ngNoInject"
and do exactly what you think they do.
ES6 and TypeScript support
ng-annotate supports ES5 as input so run it with the output from Babel, Traceur,
TypeScript (tsc) and the likes. Use "ngInject"
on functions you want annotated.
Your transpiler should preserve directive prologues, if not please file a bug on it.
Highly recommended: enable ng-strict-di
<div ng-app="myApp" ng-strict-di>
Do that in your ng-annotate processed (but not minified) builds and AngularJS will let you know if there are any missing dependency injection annotations. ng-strict-di is available in AngularJS 1.3 or later.
Tools support
- Grunt: grunt-ng-annotate by Michał Gołębiowski
- Browserify: browserify-ngannotate by Owen Smith
- Brunch: ng-annotate-uglify-js-brunch by Kagami Hiiragi
- Gulp: gulp-ng-annotate by Kagami Hiiragi
- Broccoli: broccoli-ng-annotate by Gilad Peleg
- Rails asset pipeline: ngannotate-rails by Kari Ikonen
- Grails asset pipeline: angular-annotate-asset-pipeline by Craig Burke
- Webpack: ng-annotate-webpack-plugin by Chris Liechty, ng-annotate-loader by Andrey Skladchikov
- Middleman: middleman-ngannotate by Michael Siebert
- ENB (Russian): enb-ng-techs by Alexey Gurianov
Changes
See CHANGES.md.
Build and test
ng-annotate is written in ES6 constlet style and uses defs.js to transpile to ES5. See BUILD.md for build and test instructions.
Issues and contributions
Please provide issues in the form of input, expected output, actual output. Include the version of ng-annotate and node that you are using. With pull requests, please include changes to the tests as well (tests/original.js, tests/with_annotations.js).
License
MIT
, see LICENSE file.
ng-annotate is written by Olov Lassus with the kind help by contributors. Follow @olov on Twitter for updates about ng-annotate.