Question

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

我认为在切换到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配置，以便我们只构建一个bundle而不是两个bundle。然后我们最终写了＃34;切换器＆＃34;每个模块的模块有两个不同的实现。 Switcher模块是一个新模块，它根据控制值返回正确的实现。在我们的例子中，我们最终编写了一个appMode模块，该模块最终从window对象中读取模式。

我们的一个切换台模块示例：

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

这是一个艰难的变化，因为我们有超过100个模块，有两个不同的实现，但它的工作原理。

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

1 个答案: