多个条目的 Webpack 多个 resolve.alias 列表

Question

我正在尝试将我们旧的 require.js grunt 构建应用程序转换为 webpack。在我们当前的 grunt 设置中，我们构建了两个不同的包，并且我们有一个引导文件，我们可以在其中决定启动应用程序时需要哪个包。

我认为在切换到 webpack 时我们应该保持这种结构。但是，当我尝试使用多个条目配置 webpack 时，我遇到了无法为单独的入口点提供单独的解析别名列表的问题。我需要能够提供这些别名列表，因为我们有许多模块需要其他模块名称，即require("my-module")，并且我们在两个包中都有不同的my-module 实例。

我找不到使用 webpack 实现此目的的方法。可能是我陷入了这种心态，无法找到解决此问题的替代方案，因此欢迎任何建议！

这是我想做的代码：

webpack.config.js

module.exports = {
  entry: {
    cats: ["./app/app-cats"],
    dogs: ["./app/app-dogs"]
  },
  output: {
    path: path.join(__dirname, "bin"),
    filename: "[name].entry.js"
  },
  resolve: {
    alias: {
      // I would like to provide both entry points their own
      // list of aliases, but currently webpack is not supporting this.
      cats: {
        animals: './cats.js'
      },
      dogs: {
        animals: './dogs.js'
      },
    }
  },
};

以下是用于说明我们当前构建如何工作的其余文件：

cats.js

var cats = ['dave', 'henry', 'martha'];
module.exports = cats;

dogs.js

var dogs = ['hulda', 'hilla'];
module.exports = dogs;

app-cats.js

var animals = require('animals')
console.log(animals);

app-dogs.js

var animals = require('animals')
console.log(animals);

Answer 1

由于这个问题没有答案，我将解释我们最终是如何在我们的项目中解决这个问题的。

首先，我们更改了 webpack 配置，以便我们只构建一个包而不是两个包。然后我们最终为每个具有两种不同实现的模块编写了“切换器”模块。 Switcher 模块是一个新模块，它根据控制值返回正确的实现。在我们的例子中，我们最终编写了一个 appMode 模块，该模块最终从窗口对象中读取模式。

我们的切换器模块之一的示例：

define(["appMode", "scripts/userData/firstUserData", "scripts/userData/secondUserData"],
(appMode, firstImplementation, secondImplementation) => appMode.useFirstData() ? firstImplementation : secondImplementation)

这是一个费力的改变，因为我们有 100 多个模块，它们有两种不同的实现，但它确实有效。