webpack代碼在導入庫中拆分

我有一個webapp，A，我正在用webpack 2構建。我也有一個庫，L，我也在用webpack 2構建; A進口L來完成工作。到現在爲止還挺好。webpack代碼在導入庫中拆分

當我試圖在我的庫中使用require.ensure()代碼拆分出僅用於特定代碼路徑的相當大的依賴項時，我遇到了麻煩。 Webpack似乎正確地構建了庫，並且我看到一個額外的塊發送到我的庫的輸出目錄，但是當我運行webpack-dev-server來提供我的應用程序時，我得到瀏覽器控制檯錯誤，抱怨塊加載失敗：

GET http://localhost:8081/0.index.js 404 
Error: Loading chunk 0 failed. 
    at HTMLScriptElement.onScriptComplete

0.index.js確實是包含我的大胖子依賴項的庫塊。我在圖書館的WebPack配置設置output.chunkFilename沒有改變的WebPack-DEV-服務器進行HTTP請求的URL，但還是造成了404：

GET http://localhost:8081/library-chunk-0.js

我使用這個的WebPack配置爲我的圖書館：

{ 
    entry: './src/index.js', 

    module: { 
    rules: [{ 
     test: /\.js$/, 
     loader: 'babel-loader' 
    }] 
    }, 

    output: { 
    chunkFilename: 'library-chunk-[name].js', 
    filename: 'index.js', 
    library: 'my-library', 
    libraryTarget: 'commonjs2', 
    path: path.resolve(__dirname, 'dist'), 
    publicPath: '/' 
    } 
}

我的web應用程序的輸出目錄中沒有我的庫的塊。如何讓我的庫的所有塊都可以在我的webapp的輸出目錄中使用，以便它們可以通過webpack-dev-server提供（並因此在分發webapp時出現）？

來源

2017-04-27 Dan O

webpack-dev-server,doesn't store bundle files on the disk，但在飛行中爲他們服務。所以你將無法在你的dist目錄中找到它們，這不是問題所在。

我注意到你在你的配置對象上指定了output.library and output.libraryTarget。

由於您正在構建應用程序，而這些是用於創作庫的特殊配置，因此您可能不需要它們。嘗試刪除它們，因爲它們適合與異步塊不同的方案並可能發生衝突。

來源

2017-05-05 10:45:18

webpack代碼在導入庫中拆分

回答

相關問題