Webpack require.ensure動態字符串路徑

Question

我需要動態地使用webpack異步加載模塊。我的目標是循環訪問一個數組並加載這些模塊（這是爲了我的反應路由器的目的，這裏不重要）。

這是我的代碼：

const arr = ['some-module', 'module-2']; 
arr.map(moduleName => { 
    require.ensure([], require => { 
    if(process.env.IS_BROWSER) { //for react server-render because of babel 6 
     cb(null, require(moduleName)); 
    } 
    else { 
     cb(null, require(moduleName).default); 
    } 
    }); 
} 

它運作良好，在服務器上，但在前端，附加束沒有取得和加載。你知道如何解決它嗎？謝謝。

Answer 1

正如你可能知道Webpack是一個靜態模塊捆綁器，所有的模塊應該靜態解析。它不支持解析完全動態的資產表達式。

它可以解決一些動態表情靜態像

var a = 'a'; 
require.ensure([], function (require) { 
    // all dynamic entry modules inside /dynamic/ folder 
    console.log(require('./dynamic/' + a)); 
}); 

如果你想生成每個模塊一個大塊，你可以與束裝載機組合使用require.context。

var a = './a'; 
require.context('bundle!./app')(a)(function(moduleTest){ 
    console.log(moduleTest); 
});