Upgrade webpack to version 5 #26382
Upgrade webpack to version 5 #26382
Conversation
|
Size Change: -34.1 kB (-3%) Total Size: 1.25 MB
ℹ️ View Unchanged
|
They should now be fixed. |
gziolo
added
[Type] Build Tooling
| @@ -61,6 +61,7 @@ module.exports = { | |||
| ], | |||
| }, | |||
| mode, | |||
| target: 'browserslist', | |||
There was a problem hiding this comment.
I assume we will need to apply the same changes in the shared config in @wordpress/scripts. I can take care of it later, once the build process for Gutenberg is polished.
There was a problem hiding this comment.
Yep, at this moment, this doesn't even have the desired effect because webpack/webpack#11754 wasn't released yet. So it's hard to test properly.
There was a problem hiding this comment.
A month later, target: 'browserslist' now works perfectly after a few more webpack 5 bugfix releases. I also added the target config to the shared webpack config in packages/scripts.
jsnajdr
force-pushed
the
upgrade/webpack5
branch
from
ff910de
to
7f2ff33
Compare
jsnajdr
force-pushed
the
upgrade/webpack5
branch
2 times, most recently
from
950c05d
to
cf62b42
Compare
jsnajdr
force-pushed
the
upgrade/webpack5
branch
2 times, most recently
from
2519ff7
to
cbb4285
Compare
jsnajdr
changed the base branch from
master
to
webpack5/dependency-extraction-plugin
jsnajdr
force-pushed
the
upgrade/webpack5
branch
from
cbb4285
to
c5b7f36
Compare
jsnajdr
force-pushed
the
upgrade/webpack5
branch
from
c5b7f36
to
cb15e13
Compare
|
It looks two PRs that are open:
Should bring this PR to a tiny size when you exclude the lock file changes 😃 |
That's true, it will be ridiculously simple after these two PRs are merged. Change version in Building the Gutenberg libraries is fairly straightforward, much simpler than a typical SPA with async-loaded chunks and many other optimizations. |
|
It looks like Storybook doesn't work at all when webpack 5 is installed: |
|
Thanks @gziolo for finishing and merging this upgrade 🎉
Does that mean that Storybook is currently broken in Gutenberg? |
Yes, it is broken. See: https://github.com/WordPress/gutenberg/runs/1640682536
As a temporary solution, we need to find a creative way to run Storybook with webpack 4 ... |
|
|
|
|
|
I opened #27974 where I plan to revert these changes. It looks like we need to wait another couple of weeks until Storybook and all webpack plugins in use have good support for v5. |
|
It's now reverted. We need to open another PR to track progress. @jsnajdr, major props for the work done so far 🙇🏻 |
|
The issue with Storybook is very similar (if not exactly the same) as the one that @scinos encountered in Calypso with
Now the webpack 4 compilation in The A possible solution could be something like Yarn's Another option is to manually patch the |
|
I want to surface another issue I know @jsnajdr was already aware of. Webpack 5 compiled sources may not be compatible with the Plugin Repository i18n string extraction. Apparently webpack 5 outputs module function calls of the form The webpack 5 form does not seem to be properly extracted (e.g. cc: @swissspidy |
|
@sirreal Sounds like we should add support for it in WP-CLI soon then! Can you confirm that this is the correct output for webpack 5? |
Yes, I looked at the compiled plugin from the commit that landed this PR: 85eda57 It shows this type of usage. Here's a sample: |
|
Ah, looks like it's a Babel thing ten, not webpack specific |
|
@swissspidy The In webpack 4, they used |
|
Webpack 5 support for Storybook is still behind the flag but at least there is some progress:
|
OK 🙂 Hopefully in the next two weeks -- I'm a bit overwhelmed these days. |
Closes #21647.
This is a draft PR that upgrades webpack to version 5. There are 18 small commits that make independent changes that are needed. Most can be merged as separate PRs, to make things compatible between v4 and v5 before actually doing the upgrade.
Migration guide:
https://webpack.js.org/migrate/5/
Cc @scinos who's also interested in webpack 5 but is not a member of this repo, so I cannot add him as a reviewer 🙂