Next.js doesn't currently provide a way to configure webpack build loaders used by Next build. When using big externally built bundles, the build times become much longer than they should.
Here's an example: https://github.com/Ekenorg/nextdemo
Here are two ways I could find to work around this:
Using a webpack pitch loader prevents other loaders from being applied, for example expose-loader.
config.module.rules.push(
{ test: /bundlename.js/, loader: 'expose-loader?Bundlename' }
)
This requires using a global variable though.
Another was to use a hack in next.config.js webpack section:
config.module.rules.forEach(function(rule) {
if (!(rule.exclude instanceof Array) && typeof rule.exclude != "undefined") {
rule.exclude = [rule.exclude]
}
rule.exclude = rule.exclude || []
rule.exclude.push(path.resolve(__dirname, "path to be excluded"))
})
In the example using either of these ways reduces the page build time from than +30 seconds to couple of seconds.
This could be fixed by adding an exclude section support to next.config.js file or by providing an config.modules.rule example in the documentation.
In the example using either of these ways reduces the page build time from than +30 seconds to couple of seconds.
Actually. This is something awesome.
I'd like to invest a bit on this.
Going to close this as webpack is now used in a universal way so excluding works on server/client.
Most helpful comment
Actually. This is something awesome.
I'd like to invest a bit on this.