Webpack 可以做多个条目，如何为 resolve.alias 做同样的事情？答案

【问题标题】：Webpack can do multiple entries, how can I do the same thing for resolve.alias?Webpack 可以做多个条目，如何为 resolve.alias 做同样的事情？
【发布时间】：2019-07-03 04:59:26
【问题描述】：

Webpack 可以像这样执行多个条目：

module.exports = {
  entry: {
    pageOne: './src/pageOne/index.js',
    pageTwo: './src/pageTwo/index.js',
    }
};

但是如何为 pageOne 和 pageTwo 创建两个不同的别名？

module.exports = {
  entry: {
    pageOne: './src/pageOne/index.js',
    pageTwo: './src/pageTwo/index.js',
    }
    resolve: {
        alias: {
            aliasForPageOne: ?, // What should I do?
            aliasForPageTwo: ?,
        },
    },
};

我问这个问题是因为我想将react 用于pageOne，但将react 别名为preact 用于pageTwo（我什至希望别名node_modules react component to preact）

我怎样才能做到这一点？

【问题讨论】：

标签： javascript reactjs webpack preact

【解决方案1】：

我认为您的方法不可能做到这一点。 alias 值必须是基于 Webpack Docs 的字符串。如果你真的有两个单独的页面，你可以试试 Webpack 的multiple configuration ability。

在您的情况下，这意味着以下内容：

// note the exported array
module.exports = [
{
  entry: {
    pageOne: './src/pageOne/index.js',
    }
},
{
  entry: {
    pageTwo: './src/pageTwo/index.js',
  },
  resolve: {
    alias: {
      'react': 'preact'
    }
  }
}
];

另一种方法是在 pageTwo 上的脚本中直接导入 preact，但根据您的方法，我认为这在您的情况下不是有效的方法。

【讨论】：