Webpack Intermediate Entry

A webpack plugin allowing you to specify a "middleware" file which takes the place of your entries. With it you can programatically bundle any number of entry modules, all of which should share a common bootstraping logic. For each entry file, the common module will be loaded instead. Within that common module, importing __webpack_entry__ will resolve to the original entry file respective to each instance of the common, inserted module.

Use Case

Similarly to a React Next.js stack, you might have a folder containing a number of modules. Each of those export a default component, which supplies the "page" for a named route. This plugin allows a similar workflow, but to those who prefer shipping static page-bundles using HTMLWebpackPlugin, thus bypassing SSR.

Install

npm install --save-dev webpack-intermediate-entry

How to use

Check out /example in this repo for a good example of how this plugin fits into a project.

In your config, import and include this package amongst your plugins.

• webpack.config.js

const IntermediateEntryPlugin = require("webpack-intermediate-entry");

module.exports = {
    entry: {
        hello: "./hello.js"
    },
    plugins: [
        new IntermediateEntryPlugin({ insert: "./init.js" })
    ]
}

In your config, import and include this package amongst your plugins.

• hello.js

export default "Hello World!"

Within your intermediate, you can include common init logic. Simply import your actual entry and do what you will with it.

• init.js

import Entry from "__webpack_entry__";

console.log(Entry);

In a more realistic use case, init.js might contain a ReactDOM.render() call, which consumes the component suppliedby your entries.

License

MIT License