<p>我想创建一个构建，根据环境变量，在捆绑包中只包含特定的组件。</p> <p>例如，当我像这样导入组件：</p> <pre class="brush:php;toolbar:false;">import Module1 from '@/components/Module1'</pre> <p>我希望路径实际上被转换，使得导入看起来像这样：</p> <pre class="brush:php;toolbar:false;">import Module1 from '@/components/brands/' + process.env.APP_BRAND + 'Module1'</pre> <p>现在，我不想对所有的导入都这样做，只想对特定的导入（例如，具有品牌版本的模块）进行这样的操作，所以也许我想在导入路径前加上类似于<code>!brand!</code>的前缀，这将是应用路径转换的指示符。 因此，上述逻辑应仅对以下导入路径执行：</p> <pre class="brush:php;toolbar:false;">import Module1 from '!brand!@/components/Module1'</pre> <p>如果<code>process.env.APP_BRAND</code>为假值，那么我只想保持原始导入（例如，只从路径中删除<code>!brand!</code>前缀）。</p> <p>所以重要的一点是，我希望这在构建时完成，这样Webpack可以静态分析模块并创建优化的构建。这个可行吗？我想我需要以某种方式添加这个路径转换逻辑，但是我应该如何做呢？我应该创建一个loader，插件还是有现成的解决方案吗？</p> <p>我正在使用Webpack 5。</p>

const path = require('path');

module.exports = {
  resolve: {
    alias: {
      '@/components/Module1': path.join(
        __dirname,
        process.env.APP_BRAND
          ? '@/components/brands/' + process.env.APP_BRAND + 'Module1'
          : '@/components/Module1')
    }
  },
};