-
Notifications
You must be signed in to change notification settings - Fork 319
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix tree-shaking of inner modules for the Webpack integration #4980
Conversation
9f614ab
to
c48b3c6
Compare
c48b3c6
to
f3e32e2
Compare
f3e32e2
to
1770bfa
Compare
1770bfa
to
0e37a87
Compare
📋 StatsFile sizes
Modules
View stats and visualisations on the review app Action run for e3b3ca7 |
0e37a87
to
7093122
Compare
7093122
to
fab6987
Compare
fab6987
to
ae9f5c2
Compare
ae9f5c2
to
b4f13eb
Compare
b4f13eb
to
e211713
Compare
db73953
to
0eaeb88
Compare
// Reproduce Webpack's defaults | ||
// https://webpack.js.org/configuration/optimization/#optimizationminimizer | ||
compress: { | ||
passes: 2 | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
note Unfortunately, Webpack does not have any option to merge a custom config over the default it uses when in production
mode, so I've made sure to add back Webpack's default to be as close as possible to an actual build.
…modules request-checks: true
0eaeb88
to
fdb79a2
Compare
We were not quite following the right step to optimise the build as it would be in an actual production set up while still retaining the possibility to inspect the content
|
||
- name: Check absence of unused utility functions in `single-component.js` | ||
working-directory: ./.github/workflows/bundler-integrations | ||
run: | | ||
! grep "getFragmentFromUrl" dist/${{matrix.bundler}}/single-component.js -q | ||
|
||
- name: Check presence of modules in `initAll.js` | ||
working-directory: ./.github/workflows/bundler-integrations | ||
run: | |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
note Splitting those on their own command. Despite GitHub using the -e flag for its default shell, which should fail fast, the grep for getFragmentFromUrl
failing didn't lead to the failure of the check.
We were not quite following the right step to optimise the build as it would be in an actual production set up while still retaining the possibility to inspect the content. This PR amends the Webpack build so tree-shaking is set up properly and internal utilities not used by
single-component.mjs
get excluded.Tree-shaking in Webpack is not only a matter of setting
usedExports
(which still includes unused code, just doesn't export it), but also of having theTerserPlugin
set up, as it's the one effectively removing the unused code.Instead, tree-shaking is properly set up by using the
production
mode. We can then tweak the configuration of TerserPlugin, disabling mangling so we can look at class, function and variable names in the output.Closes #4964