的WebPack：require.ensure和額外的供應商捆綁

Question

我的網站有兩種頁：

頁即JavaScript小部件的頁面（類型A）的主要內容，並在小部件是一些額外的內容，那用戶可能要觸發（TypeB）。

所以我想我的JS代碼庫分成三束：

• vendor.js - 這是包含在所有
• runtime.js頁 - widget的
• 針對不同頁面的具體切入點

對於類型A-網頁我有這樣的：

<script src="vendor.js"></script> 
<script src="runtime.js"></script> 
<script src="pageA.js"></script> 
<!-- pageA.js launches the widget --> 

但對於我的TypeB希望得到以下

<script src="vendor.js"></script> 
<scriprt> 
    <!-- pseudo code --> 
    when('user clicks button', function() { 
    require.ensure('pageB.js', function(require) { 
     var pageBCode = require('pageB.js'); 
     <!-- do the magic --> 
     <!-- but I also need runtime.js here --> 
    }); 
    }); 
</script> 

的問題是，我想在這兩個同步和異步頁面重用runtime.js。但我想不通如何加載runtime.js以及我的按需加載pageB.js。我仍然需要通過<script src="runtime.js"></script>來包含它。

（我用CommonChunksPlugin創建vendor.js和runtime.js，和它運作良好，在類型A頁）

Answer 1

你可以傳遞一個數組require.ensure這樣：爲什麼你不能做這樣的事`

require.ensure(['pageB.js','runtime.js'], function(require){ 
    var pageBCode = require('pageB.js'), 
     runtimeCode = require('runtime.js'); 

    /** MAGIC! **/ 
});