Update Webpack to v5

[mshustov]

update to webpack v5 should:

• significantly improve build time due to new caching mechanisms
• allows us to remove several babel plugins for JS syntax supported natively
• provide us with an opportunity to experiment with module federation feature which might be a game-changer for the problem with bloated bundle sizes.

[elasticmachine]

Pinging @elastic/kibana-operations (Team:Operations)

[mshustov]

blocked by cypress-io/cypress#8900
but there is workaround provided cypress-io/cypress#8900 (comment)

[watson]

Any update on this issue? The mentioned blocker has been fixed and we're already using a newer version of cypress that now supports webpack 5 👍

[mistic]

We have a deep abstraction over webpack@4 that was needed in order to create the @kbn/optimizer. Our team is short of hands at the moment and I don't think we will be able to prioritise this in the short/medium term as I think it won't be a trivial effort. Aside from that Module Federation was ported into webpack@4 and we still need to validate if webpack@5 really offer us the performance benefit we think it will. (\cc @spalger to make sure I'm not forgetting anything important).

@watson is this blocking you or somehow related with the deprecated hash algorithms on the node upgrade?

[watson]

@mistic no it was due to some security vulnerabilities in some of the dev-dependencies we have related to webpack@4 that can only be fixed by upgrading to webpack@5. It's not a security issue per se as we're not impacted, but it's annoying to have them show up in scans.

[markov00]

@mistic If I'm not wrong this also un-blocks importing dependencies (like elastic-charts) directly as ES modules instead of CommonJS as done now. (but I maybe wrong)

[mistic]

@markov00 probably just for client side code, we will have to also do the same for server side code. I think 😃

@watson @markov00 we will probably took a look at this in the future but we can't at the moment. We have other priorities to work on in foreseeable future 😬

[cee-chen]

Quick note to self: Once webpack is on v5, the EUI team should attempt to unpin @hello-pangea/dnd from 16.2.0 🤞 (see #166676 (comment))

[kc13greiner]

This upgrade would also allow engineers to run FIPS mode locally.

Our current version of Webpack has many hardcoded usages of md4 and md5

See node_modules/webpack/lib/ModuleFilenameHelpers.js and node_modules/webpack/lib/SourceMapDevToolPlugin.js

The changes in later versions of Webpack 5 respect the output.hashFunction better, which can be set to a compliant algorithm.

It might also be worth mentioning (since it might be involved in this work): webpack's file-loader is deprecated and has a default usage of md5, it is recommended to use asset-modules if we upgrade!