如何從外部URL包含一個webpack模塊？

Question

我有兩個應用程序，都使用webpack。每個應用程序需要不同的JavaScript模塊例如，app1不使用反應，app2確實使用反應。我試圖將app2中的webpack模塊包含到app1中。我正在使用CommonsChunkPlugin從app1和app2s主文件中提取webpack運行時。因此，從app1開始，我有一個頁面，其中包含init.js腳本，app1.js腳本，然後我通過url包含app2.js文件（即通過代理服務器http://proxy/app2/js/app2.js，因此沒有跨站點問題）。

加載了來自app2的javascript，但似乎並未看到webpack模塊實際上正在加載。當它加載到app1的頁面上時，找不到app2（即react）所需的模塊。

有沒有辦法做到這一點？我基本上想要它延遲加載app2包，但webpack似乎並不想從網址獲取文件（也不希望它在構建時得到它）。我注意到init.js腳本是不同的，因爲每個應用程序都有它自己的入口點。這就像我需要指定一個懶惰加載的入口點或什麼。請幫忙！

Answer 1

我剛剛發現webpack可以在其他應用中使用output Libraries。所以，我已經改變了app2來輸出一個庫，然後我將它包含在app1中，它就像一個魅力。如果需要，所有必需的依賴關係也可以同時出現，或者您可以將它們指定爲外部依賴關係。這裏是我的WebPack配置的一個例子app2：

var webpack = require('webpack'); 

module.exports.getConfig = function (type) { 

    var isDev = type === 'development'; 

    var config = { 
     entry: { 
      one: "./src/main/javascript/one.js", 
      two: "./src/main/javascript/two.js" 
     }, 
     output: { 
      path: __dirname + "/src/main/webapp/static/js", 
      filename: "[name].js", 
      library: ["MyLibrary", "[name]"], 
      libraryTarget: "umd" 
     }, 
     ... 

然後在app1，我只是包括腳本標記腳本one.js，它加載了就好了。需要注意的是，我必須從app2中刪除CommonsChunkPlugin，因爲運行時會獲得您的庫名稱的前綴。因此，您需要將其全部包含在庫中才能正確加載。