我在Webpack中使用AngularJS 1.5.6。
我的文件架构是:
app
|- scripts
| |- modules
| |- homepage
| |- homepage.js
| |- controller
| |- HomepageController.js
|- app.js
|- index.html
webpack.config (如果您需要查看此文件的更多信息,请告诉我):
module.exports = {
context : __dirname + "/app",
entry : {
main: "./app.js",
vendor: [
'angular',
'angular-route'
]
},
[...]
};
index.html 包含js文件的导入:
<script type="text/javascript" src="vendor.js"></script>
<script type="text/javascript" src="main.js"></script>
在 apps.js :
(function () {
'use strict';
require('./scripts/modules/homepage/homepage');
angular.module("NgAppProject", [
'ngRoute',
'ng',
'Homepage'
]);
})();
在 homepage.js :
(function () {
'use strict';
angular.module('Homepage', [
'ngRoute',
'ng'
])
.config(['$routeProvider', '$controllerProvider', function($routeProvider, $controllerProvider) {
$routeProvider
.when('/home', {
templateUrl: 'scripts/modules/homepage/views/homepage.html',
controller: 'HomepageController',
controllerAs: 'homepageController',
resolve: {
deps: function() {
return require.ensure([], function (require) {
$controllerProvider.register("HomepageController", require('./controllers/HomepageController'));
}, '_homepage');
}
}
});
}]);
})();
问题:
当我启动我的应用程序并转到localhost:8080 /#/ home时,我收到错误:
Error: [ng:areq] Argument 'HomepageController' is not a function, got undefined
我认为它无法找到我的控制器,但我无法弄清楚原因。
然而,这很好用:
angular.module('Homepage', [
'ngRoute',
'ng'
])
.config(//config here)
.controller("HomepageController", require('./controllers/HomepageController'));
我真的很欢迎任何帮助,谢谢!
答案 0 :(得分:1)
我认为require.ensure
没有回报承诺。所以,你可以尝试这种方法:
resolve: {
deps: ['$q', function($q) {
var deferred = $q.defer();
require.ensure([], function(require) {
$controllerProvider.register("HomepageController", require('./controllers/HomepageController'));
deferred.resolve();
}, '_homepage');
return deferred.promise;
}]
}