Can your webpack.config file serve multiple entry points?

Viewed 1965

Due to learning Angular 2 while developing the project, I did not incorporate routing as well as I should have. I have a main.js file that bootstraps one component, and another main2.js file that bootstraps a second component (I know now that I should have routed them from one page, but we are very far into the project that it will cause a backup ((will do if necessary however)). I am trying to use webpack to bundle the code for 'loadability' (sp?).

Here is my webpack.config.js file:

var path = require( 'path' );
var webpack = require( 'webpack' );

module.exports = {
    entry: "./main",
    output: {
        path: __dirname,
        filename: "./dist/bundle.js"
    },
    resolve: {
        extensions: ['.js', '.ts']
    },
    module: {
        loaders: [{
            test: /\.ts/, loaders: ['ts-loader'], exclude: /node_modules/
        }]
    }
};

Would it be possible to define two entry points like so:

var path = require( 'path' );
var webpack = require( 'webpack' );

module.exports = {
    entry: "./main",
    output: {
        path: __dirname,
        filename: "./dist/bundle.js"
    },
    resolve: {
        extensions: ['.js', '.ts']
    },
    module: {
        loaders: [{
            test: /\.ts/, loaders: ['ts-loader'], exclude: /node_modules/
        }]
    }
};

module.exports = {
    entry: "./main2",
    output: {
        path: __dirname,
        filename: "./dist/bundle2.js"
    },
    resolve: {
        extensions: ['.js', '.ts']
    },
    module: {
        loaders: [{
            test: /\.ts/, loaders: ['ts-loader'], exclude: /node_modules/
        }]
    }
};

OR am I better off going back and re-structuring my project to use routing and have one entry point serve me components?

1 Answers
Related