Andy
Andy

Reputation: 121

Separating externals in Webpack

I'm trying to seperate React & React Dom from just one of my JS builds (server-sitecore) but can't seem to find any examples of this online. Maybe this isn't the only solution.

In my Webpack bundle the entry is as follows:

<code>
entry: {
   'server-node': [
       './src/router'
    ],
    'server-sitecore': [
       './src/reactsitecore/index'
    ],
    client: [
        './src/client/index'
    ]
}
</code>

And if I add the following externals as follows then it understandably removes the two dependencies from all builds...

externals: { 'react': 'React', 'react-dom': 'ReactDOM' }

How do I remove these two dependencies from the 'server-sitecore' build?

Thanks

Upvotes: 2

Views: 120

Answers (1)

You can use webpack in multicompiler mode for more control. Basic idea:

module.exports = [{... config ...}, ...];

In this case you would separate entries into two configurations like that. If you want to share bits between them, you could try a solution such as webpack-merge (disclaimer: I'm the author).

Upvotes: 1

Related Questions