Skip to content

Instantly share code, notes, and snippets.

@kensnyder
Created October 20, 2015 23:30
Show Gist options
  • Save kensnyder/a80ca6e689a9a56ca30b to your computer and use it in GitHub Desktop.
Save kensnyder/a80ca6e689a9a56ca30b to your computer and use it in GitHub Desktop.
Using ng-annotate loader with Webpack + Angular 1.x + ES6 classes + Babel
module.exports = {
devtool: 'sourcemap',
context: __dirname,
entry: './entry.js',
output: {
filename: './dist/bundle.js'
},
module: {
loaders: [
// run babel first then ng-annotate
{ test: /\.js$/, loaders: ['ng-annotate','babel'] },
{ test: /\.html$/, loader: 'raw' },
{ test: /\.css$/, loader: 'style!css' }
]
}
};
import './components/my/myModule.js';
import angular from '../vendor/angular';
import SomeCtrl from './Some/SomeCtrl.js';
angular.module('my', [])
.controller('SomeCtrl', SomeCtrl)
;
// my controller now is one class all by itself
export default class SomeCtrl {
// add 'ngInject'; somewhere inside a function that needs injections
// Babel will leave the string alone and ng-annotate can do its magic
constructor($http) { 'ngInject';
console.log('yay $http!', $http);
}
}
@jziggas
Copy link

jziggas commented May 16, 2017

Which ng-annotate library is this for?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment