[webpack5-localization-plugin] TypeError: `Cannot destructure property 'WebpackError' of 'compiler.webpack' as it is undefined.`

[TheLarkInn]

Summary

Upon using @rushstack/webpack5-localization-plugin in a webpack 5 project you receive the following error:

Cannot destructure property 'WebpackError' of 'compiler.webpack' as it is undefined. It looks like the suspect code is one of two places:

https://github.com/microsoft/rushstack/blob/8387963bb4ab479395018de705d8d98987549236/webpack/webpack5-localization-plugin/src/AssetProcessor.ts#L75

or

https://github.com/microsoft/rushstack/blob/8387963bb4ab479395018de705d8d98987549236/webpack/webpack5-localization-plugin/src/LocalizationPlugin.ts#L134

I haven't investigated too deeply here but my guess is that either WebpackError doesn't live on the compiler.webpack property or somewhere compiler or compilation might be undefined. To be safe, at minimal cost, we can just import WebpackError instead of accessing it from the webpack object from within the plugin.

[TheLarkInn]

Upon further investigation and local testing it appears that here:

https://github.com/microsoft/rushstack/blob/8387963bb4ab479395018de705d8d98987549236/webpack/webpack5-localization-plugin/src/LocalizationPlugin.ts#L116

The compiler has not set the webpack property. I guess is that this needs to be done actually in a compiler hook. I will continue to investigate this before submitting a PR.

[TheLarkInn]

Upon further investigation it appears that this was caused by a rogue tapable: 1.1.3 being installed in some upstream dependency also using the plugin side-by-side.

We can close this as user error but maybe we should just warn or throw with the plugin if compiler.webpack is not available as this is a clear webpack@5 only behavior.

[dmichon-msft]

This package was very carefully constructed to only ever access webpack via compiler.webpack to ensure version consistency.