angular modules suck when you already have require. lets remove them by putting everything into a module called 'app'
npm install remove-angular-modules-loader
in your webpack config's loaders section:
{
test: /\/angular(.min)?\.js$/,
loader: 'remove-angular-modules'
},
moduleName is optional, default module name is 'app'. It is recommended that you update your html with this module name.
moduleName
name of the module that everything will go intowhiteList[]
allow these modules to be created under their original module nameblackList[]
ignore creation of these modules. no code registered to these modules will ever runtesting
valid values: 'unit' or 'e2e'. ngMock contains both types of modules, so this will properly configure the blacklist property for you. Use this only when testing with ngMock or ngMockE2E
example
{
test: /\/angular(.min)?\.js$/,
loader: 'remove-angular-modules?moduleName=hourlynerd&whiteList[]=foo&whiteList[]=bar&blackList[]=skillbridge&testing=e2e'
}
It patches angular to put everything into a single module*. You no longer need to define module dependencies when creating modules, or names for that matter.
-
protractorBaseModule_
remains its own module because otherwise protractor tests don't work. (you can still blacklist it)
This is now valid:
angular.module().controller('MyController', ....)
but your old code will still work too.
Now you can focus on requiring angular things with webpack just like you require everything else.
The magic happens when we append the following script to the end of angular.js (ok, its a bit longer now...)
(function(a, moduleName) {
//remove angular module system, everything is now in the `moduleName` module ;)
var _module = a.bind(a, a.module);
var m = _module(moduleName, []);
a.module = function () { return m;};
document.querySelectorAll('[ng-app]')[0].setAttribute('ng-app', moduleName);
})(window.angular, 'moduleNameFromConfig');