Angular Guidelines when using WebPack

angular-webpack-guidelines.md

No more IIFE

• WebPack wraps each requireed code with a function, so there's no need to wrap our code with an IIFE

/**
 * Good
 */

'use strict';

function TestController($scope) {

}

module.exports = TestController;

/**
 * Bad
 */
 
(function () {
	'use strict';

  function TestController($scope) {
  
  }
  
  module.exports = TestController;
}());

Dependency Injection

• Use ng-annotate-loader
• Forget about Strict DI or the long DI style
• Forget about $inject

/**
 * Good
 */

'use strict';

function TestController($scope) {

}

module.exports = TestController;

/**
 * Bad
 */

'use strict';

function TestController($scope) {

}

module.exports = ['$scope', TestController];

/**
 * Bad
 */

'use strict';

function TestController($scope) {

}

TestController.$inject = ['$scope'];

module.exports = TestController;

• In special cases where creating things dynamically, add a /* @ngInject */ comment right before the function that needs to be annotated (see Explicit annotations with ngInject)