Nuxt.js: [nuxt] Error while initializing app when build splitChunks optimizations are in use

[AndrewBogdanovTSS]

Version

2.2.0

Reproduction link

https://github.com/AndrewBogdanovTSS/nuxt-optimizations

Steps to reproduce

• Add optimization.splitChunks options (already added in the repro link)
• $ nuxt build
• $ nuxt start

What is expected ?

App is running without errors, swiper is swipable

What is actually happening?

[nuxt] Error while initializing app TypeError: i.e is not a function

Additional comments?

This error appears only in built version of the app and only when optimizations.splitChunks option is set. In dev mode it's working as expected

_{This bug report is available on Nuxt community (#c8053)}

[goodslav]

I can confirm I'm experiencing the same issue on 2.2.0 although it's happening to me even when I run nuxt. It's definitely a regression because it's working fine on 2.1.0 and there's no exception being thrown.

[manniL]

var router_7cf8be9a = function _7cf8be9a() {
  return interopDefault(__webpack_require__.e(/* import() | pages/index */ 0).then(__webpack_require__.bind(null, 131)));
};

This line is causing the problem. ~Maybe related to #4121~

Also reproducible in 2.0.0 and upwards.

[pi0]

Summary

Setting build.optimization and build.optimization.splitChunks are safe and working as expected!

Setting build.optimization.splitChunks.cacheGroups.styles with the value provided in the reproduction repository regardless of extractCSS mode will cause this error and all 2.x versions applied. (Unless someone can provide a yarn.lock that proves that option working with N2.x)

                cacheGroups: {
                    styles: {
                        name: 'styles',
                        test: /\.(css|vue)$/, // <-- This line is causing error
                        chunks: 'all',
                        enforce: true
                    }
                }

Details and Fix

Either the styles cache group should be removed or test regex changed into /\.(css)$/. Splitting page chunks into another chunk break page loading.

[manniL]

@pi0 Strange thing is, that it's the config as in https://github.com/nuxt/nuxt.js/issues/3166#issuecomment-409004911

Maybe there were some changes to the plugin in the meantime :thinking:

[pi0]

@manniL Regarding the comment, as I mentioned in the summary this bug happens even when extractCSS is false. So not related (or at least limited) to mini-css-extract-plugin. It may be something with vue-loader or vue-style-loader.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.