fix(build): fixed ng-annotate to work with tree-shaking enabled (webpack 2 loader replaced with Babel plugin)

Author: mariuszm

.babelrc

@@ -2,6 +2,9 @@
   "presets": [
     ["es2015", { "modules": false }]
   ],
+  "plugins": [
+    "angularjs-annotate"
+  ],
   "env": {
     "test": {
       "plugins": [

package.json

@@ -27,6 +27,7 @@
     "clean-webpack-plugin": "^0.1.14",
     "css-loader": "^0.26.0",
     "eslint": "^3.10.2",
+    "babel-plugin-angularjs-annotate": "0.7.0",
     "babel-preset-es2015": "^6.22.0",
     "eslint-config-angular": "^0.5.0",
     "eslint-loader": "^1.6.1",
@@ -44,7 +45,6 @@
     "karma-phantomjs-launcher": "^1.0.2",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^1.8.0",
-    "ng-annotate-loader": "^0.2.0",
     "ngtemplate-loader": "^1.3.1",
     "node-sass": "^3.13.0",
     "postcss-loader": "^1.1.1",

src/app/common/nav/nav.controller.js

@@ -1,6 +1,6 @@
 class AppNavController {
+  /* @ngInject */
   constructor (conf) {
-    'ngInject';
     this.conf = conf;
 
     console.time('App init');

src/app/components/about/about.controller.js

@@ -1,6 +1,6 @@
 class AboutController {
+  /* @ngInject */
   constructor () {
-    'ngInject';
     this.title = 'About';
   }
 

src/app/components/about/about.module.js

@@ -2,8 +2,8 @@ import angular from 'angular';
 import { AboutComponent } from './about.component';
 import './about.scss';
 
+/* @ngInject */
 const config = ($stateProvider) => {
-  'ngInject';
   let about = {
     name: 'about',
     url: '/about',

src/app/components/home/home.controller.js

@@ -1,6 +1,6 @@
 class HomeController {
+  /* @ngInject */
   constructor () {
-    'ngInject';
     this.title = 'Home';
   }
 

src/app/components/home/home.module.js

@@ -2,8 +2,8 @@ import angular from 'angular';
 import { HomeComponent } from './home.component';
 import './home.scss';
 
+/* @ngInject */
 const config = ($stateProvider) => {
-  'ngInject';
   let home = {
     name: 'home',
     url: '/home',

src/app/root.controller.js

@@ -1,6 +1,6 @@
 class RootController {
+  /* @ngInject */
   constructor ($transitions) {
-    'ngInject';
     this.$transitions = $transitions;
 
     console.time('App init');

src/app/root.module.js

@@ -6,8 +6,8 @@ import { ComponentsModule } from './components/components.module';
 import { CommonModule } from './common/common.module';
 import '../sass/main.scss';
 
+/* @ngInject */
 const config = ($compileProvider, $stateProvider, $urlRouterProvider) => {
-  'ngInject';
   $urlRouterProvider.otherwise('/home');
 
   // https://medium.com/swlh/improving-angular-performance-with-1-line-of-code-a1fb814a6476
@@ -23,8 +23,8 @@ const config = ($compileProvider, $stateProvider, $urlRouterProvider) => {
   // });
 };
 
+/* @ngInject */
 const run = ($rootScope, $state, $stateParams) => {
-  'ngInject';
   $rootScope.$state = $state;
   $rootScope.$stateParams = $stateParams;
 };

webpack.base.conf.js

@@ -40,7 +40,7 @@ module.exports = {
 
       {
         test: /\.js$/,
-        loaders: ['ng-annotate-loader', 'babel-loader', 'eslint-loader'],
+        loaders: ['babel-loader', 'eslint-loader'],
         exclude: /node_modules/
       },