Migrate to webpack 4.x

Description

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.

Environment

None

Potential Workaround

None

Checklist

hide

TestRail: Results

Activity

Show:

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.

, 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 for development and production.

  • 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 and webpackExclude 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.

Done

Details

Assignee

Reporter

Priority

Fix versions

TestRail: Cases

Open TestRail: Cases

TestRail: Runs

Open TestRail: Runs
Created March 19, 2018 at 4:30 PM
Updated July 10, 2018 at 1:50 PM
Resolved July 10, 2018 at 1:50 PM
TestRail: Cases
TestRail: Runs

Flag notifications