Webpack multiple resolve.alias lists for multiple entries

Question

I'm trying to convert our old require.js grunt built application to webpack. In our current grunt setup we build two different bundles and we have a bootstrap file where we decide which bundle we require when we start the application.

I thought that we should keep this structure when switching over to webpack. However when I tried to configure webpack with multiple entries I ran into issue where I cannot provide separate resolve alias lists for separate entry points. I need to be able to provide those alias lists because we have many modules that require other modules by module-name i.e. require("my-module") and we have different my-module instances in both bundles.

I couldn't find a way to achieve this with webpack. It might be that I'm locked in to this mindset and cannot see an alternative solution for this problem, so any advice is welcome!

Here's the code what I would like to do:

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'
      },
    }
  },
};

Here are the rest of the files to illustrate how our current build works:

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

As there are no answers for this question I'll explain how we ended up resolving this in our project.

First of, we changed the webpack config so that we only build one bundle instead of two bundles. Then we ended up writing "switcher" modules for each module that had two different implementation. Switcher module is a new module which returns the correct implementation based on a control value. In our case we ended up writing an appMode module which reads the mode eventually from window object.

Example of one of our switcher modules:

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

This was a laborious change as we had over 100 modules which had two different implementations, but it works.