2016-12-01 10 views
0

Webpackで非同期ロードするためにモジュールを動的に要求する必要があります。私の目標は、配列をループしてこれらのモジュールをロードすることです(これは私のリアルーターの目的であり、ここでは重要ではありません)。Webpack require.ensure with dynamic string path

これは私のコードです:

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); 
    } 
    }); 
} 

これは、サーバー上でうまく動作しますが、フロントエンドに、追加のバンドルが行われ、ロードされません。あなたはそれを解決する方法をご存知ですか?ありがとうございました。

答えて

0

Webpackは静的モジュールバンドラであることにご承知のとおり、すべてのモジュールを静的に解決する必要があります。完全に動的なアセット表現の解決はサポートしていません。

それは、モジュールごとに1つのチャンクを生成したい場合は、バンドル・ローダーと組み合わせて使用​​することができますrequire.context静的

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

のようなものをいくつかの動的な表現を解決することができます。

var a = './a'; 
require.context('bundle!./app')(a)(function(moduleTest){ 
    console.log(moduleTest); 
}); 
関連する問題