webpack + angular 1.X不起作用

我想在我現有的angularjs [1.4.7]應用程序中使用webpack。我有一個自定義模塊，它使用webpack作爲一個包生成。我稍後將該自定義模塊添加爲其他模塊中的依賴項。生成包時我沒有收到任何錯誤。但是當我使用這個模塊作爲依賴時，它會拋出錯誤。我嘗試了一切可能，並且無法理解這裏出現了什麼問題。webpack + angular 1.X不起作用

錯誤未能實例模塊單詞數由於：錯誤：[$注射器：modulerr] .......... 當模塊加載失敗由於某種異常發生該錯誤。上面的錯誤消息應該提供額外的上下文。

模塊無法加載的常見原因是您忘記將文件包含在已定義的模塊中，或者文件無法加載。

代碼段 webpack.config.js

module.exports = { 
    entry: { 
     app: [ './src/main/resources/js/app/app.module.js' ] 
    }, 
    output: { 
     filename: './src/main/resources/js/app/bundle.js' 
    }, 
    node: { 
     module: "empty", 
     net:"empty", 
     fs: "empty" 
    }, 
    watch: false 
};

app.module.js

'使用嚴格';

var angular = require('angular'); 
module.exports = angular.module('module1', [ 
    require('./components/services').name, 
    require('./components/controllers').name, 
    require('./components/directives').name 

]);

組件/服務/ index.js

'use strict'; 
    var angular = require('angular');  
    module.exports = angular.module('services',[]) 
     .factory('Service1', require('./Service1')) 
     .factory('Service2' , require('.Service2'))

組件/服務/ service1.js

module.exports = function Service1($q) 
{ 
    var service1 = {}; 
    // service implementation 
return service1; 
};

組件/控制器/ index.js

'use strict'; 
var angular = require('angular'); 
module.exports = angular.module('controllers',[]) 
    .controller('controller1' , require('./controller1')) 
    .controller('controller2' , require('./controller2'));

組件/指令/ index.js

'use strict'; 
var angular = require('angular'); 
module.exports = angular.module('directives',['services']) 
    .directive('directive1', require('./directive1')) 
    .directive('directive2' , require('./directive2'))

的index.html

<script src="bundle.js" type="text/javascript"></script>

另一個app.js

var app2 = angular.module('Module2',['ui.router','ui.bootstrap','module1']);

來源

2017-01-18 user911

嘗試在條目中添加第二個模塊：

entry: { 
    app: [ 
     './src/main/resources/js/app/app.module.js', 
     './src/main/resources/js/app/app.js' 
    ] 
},

它將幫助您首先定義您的模塊。此外，我沒有看到您的代碼中對module2的任何引用。

來源

2017-01-18 21:15:46 Yaser

第二個模塊是一個單獨的項目[Intellij中的模塊]，因此您在這裏看不到任何參考。該項目作爲Maven依賴關係添加到定義第二個模塊的另一個項目中。 – user911

在這種情況下，它可能是執行的順序，你必須確保你的模塊2在你的依賴圖 – Yaser

中的模塊1之前加載了嗎？節點：{ 模塊：「空」，淨：「空」， fs：「空」 }， – user911

webpack + angular 1.X不起作用

回答

相關問題