Webpack build fails if webpack-i18n-extractor-plugin and mini-css-extract-plugin used together

[agavrilov]

I tried to use webpack-i18n-extractor-plugin together with mini-css-extract-plugin. The build fails with the following error:

C:\P\git\dojo-webpack-plugin-sample\node_modules\mini-css-extract-plugin\dist\index.js:81
    const resource = this._identifier.split('!').pop();
                                      ^

TypeError: Cannot read property 'split' of undefined
    at CssModule.nameForCondition (C:\P\git\dojo-webpack-plugin-sample\node_modules\mini-css-extract-plugin\dist\index.js:81:39)
    at Function.checkTest (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\optimize\SplitChunksPlugin.js:304:52)
    at Object.fn [as getCacheGroups] (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\optimize\SplitChunksPlugin.js:249:35)
    at compilation.hooks.optimizeChunksAdvanced.tap.chunks (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\optimize\SplitChunksPlugin.js:504:38)
    at SyncBailHook.eval [as call] (eval at create (C:\P\git\dojo-webpack-plugin-sample\node_modules\tapable\lib\HookCodeFactory.js:17:12), <anonymous>:7:16)
    at SyncBailHook.lazyCompileHook [as _call] (C:\P\git\dojo-webpack-plugin-sample\node_modules\tapable\lib\Hook.js:35:21)
    at Compilation.seal (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\Compilation.js:1196:38)
    at hooks.make.callAsync.err (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\Compiler.js:547:17)
    at _err0 (eval at create (C:\P\git\dojo-webpack-plugin-sample\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:11:1)
    at _addModuleChain (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\Compilation.js:1053:12)
    at processModuleDependencies.err (C:\P\git\dojo-webpack-plugin-sample\node_modules\webpack\lib\Compilation.js:979:9)
    at _combinedTickCallback (internal/process/next_tick.js:131:7)
    at process._tickCallback (internal/process/next_tick.js:180:9)

When I remove WebpackI18nExtractorPlugin from the configuration, the build finishes successfully.

The simple project demonstrating this issue can be found here.

[chuckdumont]

Thanks for the bug report. I'll take a look at it when I return from vacation next week.

[chuckdumont]

I've published version 2.0.2, which fixes the problem with your test case. I'm not sure if it will fix it for all use cases. You may end up needing to use the noLoadEntryChunkResources option to work around the issue.

Basically, the problem is that the mini-css-extract-plugin loads the bootstrap module at build time to obtain the returned reference to the entry module. The webpack-i18n-extractor-plugin modifies the bootstrap code to return a promise to the entry module rather than the entry module itself because of the need to possibly load language chunks asynchronously before the entry module can be defined, and the mini-css-extract-plugin doesn't expect the promise value.

The fix I delivered changes the behavior of the webpack-i18n-extractor-plugin to return a promise to the entry module only if there are language chunks that need to be loaded. Otherwise, it will return a reference to the module. This may be sufficient to resolve the issue since the the mini-css-extract-plugin only seems to do this when the entry module is a css module.

[agavrilov]

It works for me now. Thanks!