ウェブパック。 Theming fallback

Question

webpackでフォールバックとしてテーマパスを解決することは可能ですか？

app/ 
    ├── componentA/ 
    │ └─ index.js 
    │ 
    └── themes/ 
     └── woot/ 
      └── componentA/ 
       └── index.js 

そして私は、私は次の受信したい

import ComponentA from 'app/componentA/index.js'; 

が次にビルドに応じて、インポート操作を行います：webpack→app/componentA/index.jsため

1. それでは、私は次の構造を持っているとしましょう

2. THEME="woot" webpack→app/themes/woot/componentA/index.js

それはそのような何かでなければなりません

Answer 1

ありがとう...私はテストしていないが、私はそれは良い出発点を表すことができると思います。関連のTHEME = "woot" が定義されてNormalModuleReplacementPlugin

// webpack.config.js 
module.exports = env => { 
    const theme = env.theme || null; 

    const configs = Object.create(null); 

    configs.plugins = []; 

    if(theme) { 
    const theming = new webpack.NormalModuleReplacementPlugin(
    /(.*)Components\/index/, (resource) => { 

     resource.request = resource 
      .request 
      .replace(/Components\/index/, `Components\/${theme}\/index`); 
     } 
); 

    configs.plugins.push(theming); 
    } 

    return Promise 
    .resolve(config) 
    ; 
} 

// package.json 
{ 
    "scripts": { 
    "webpack": "webpack --config webpack.config.js" 
    } 
} 

// cli 
npm run webpack -- --env.theme=Dark