Migrate to webpack 4.x
Description
Environment
Potential Workaround
blocks
is blocked by
relates to
Checklist
hideTestRail: Results
Activity
Matt Jones June 27, 2018 at 7:51 PM
STCLI-61 needs to be completed before Karma tests via the CLI will run.
Matt Jones June 27, 2018 at 6:17 PM
It has been a while since I was actively working on this branch, but I believe the Webpack 4 upgrade is complete. I've been using it on-and-off locally with success. Builds themselves appear to be slightly slower, despite Webpack claiming 4 to be faster. This may be due to some added features/optimizations that we didn't previously have enabled, that are now enabled by default. We can always tune the configuration afterwards.
Given the complexity of the upgrade, I'd like to gather some feedback from folks to see how well it works before merging. I will create a PR shortly with instructions on how to test it out.
Matt Jones June 6, 2018 at 3:40 AM
stripes build
works! Now that serve
and build
are functional, at least in basic form, I'll exercise our various command line options to see what else needs updating. I'm sure there is also more room for config simplification given Webpack's new mode
defaults.
Extract Text Webpack Plugin: I had to replace extract-text-webpack-plugin
with mini-css-extract-plugin
. Despite some effort at making extract-text-webpack-plugin
work with Webpack 4, the general consensus is that this has been, or will soon be, deprecated for Webpack >= 4.
@Jeffrey Cherewaty, It looks like you last modified the extract-text-webpack-plugin
and postcss
configuration. I'm still tinkering with this branch, but at some point would appreciate another set of eyes to see that the output CSS is getting processed as expected with mini-css-extract-plugin
. At first glance, this appears to be working.
Matt Jones June 5, 2018 at 9:37 PM
Current progress: Our internal stripes plugins have been updated (https://folio-org.atlassian.net/browse/STCOR-217#icft=STCOR-217). Aside from a couple deprecation warnings to chase down, stripes serve
is working with Webpack 4 in the STCOR-175-webpack-4
branch.
Next, I will be updating to the production config and related plugins to support production builds with stripes build
.
Matt Jones April 27, 2018 at 7:08 PM
Notes from my earlier review of Webpack 4:
New
mode
option - Integrate with this configuration. Out of the box this is pre-configured fordevelopment
andproduction
.CommonsChunkPlugin - Not in use yet, but configuration moved to optimization
UglifyJsPlugin - Enabled in production mode by default
Extract-text-webpack-plugin - Latest stable version is not compatible with Webpack 4. Could use the latest pre-release (currently in beta), or possibly mini-css-extract-plugin as an alternative.
Webpack-hot-middleware - Upgrade
Webpack-virtual-modules - Still need to confirm compatibility
New
webpackInclude
andwebpackExclude
magic strings - Not necessary for the upgrade, but may come in handy for async loading configuration.Loaders - Still need to confirm compatibility
Breaking change to plugins: compiler.options
is no longer available while applying plugins. This will have an effect on our StripesBrandingPlugin, StripesConfigPlugin, and StripesTranslationsPlugin. They each currently access compiler.options in some form during or after the apply. Some minor refactoring will likely be necessary.
Haven't really looked into what it brings nor the extent of API changes but it makes sense to move to the current API before doing additional extensive work on our Webpack infrastructure.