How to create multiple entry points(index.js) for a single react application?

Question

I want to create two different builds for a single application. When I do an npm run build, it runs webpack and generates a build, and injects that build into the index.html file. What I ideally want to do is tell webpack to create one build from index.js and another build from index2.js. How do I achieve this? Looked into module federation, but wasn't able to figure out how to do this in a single application.

Answer 1

You can do this settings in webpack.config.js.

module.exports = {
    entry: {
        bundle1: "path for index1.js",
        bundle2: "path for index2.js"
    },
output: {
    // `filename` provides a template for naming your bundles (remember to  use `[name]`)
    filename: '[name].js'
    publicPath: 'Path for saving directory'
}};