feat(*): Webpack 4 Support for Universal CSS Chunks #71
Conversation
Webpack 4 support for extract-css-chunks universal-component react-universal. Complete with full chunking, code splitting, real and true hot module reloading. Compatible with faceyspacey universal code splitting and server-side rendering. BREAKING CHANGE: EVERYTHING! This its a complete rewrite. Top to bottom!! This is a major change to the API and Loader. It will intergrate with universal without a issue and IT DOES NOT RELY ON UNIVERSAL COMPONENTS. fix #60, re #36 #47 #51
…otfiles Staging back in stuff to be deleted in hopes of reducing the size of the inital PR. Housekeeping on dotfiles and such Adding the ability to prepack install from git directly
Fixed issues with namespacing that was causing compile issue in near production systems
Removing the old tests and implementing the new ones, we are missing some coverage
Linting the whole app so its less of a pain to use commitizen
Using a version of normalize-url which is too new and could be causing issues
New docs on implementation, API, Reasons for updateing. Currently a WIP
removing old JS files from the previous implementation, added yarn, cleaned up package deps a little
Notes on how to install a the package via a git branch
Testing collapsable summery block in order to hide the old documentation during beta/i can finish updating it
Fixing bug where loader broke due to iteration over an object key that was a string and not an array
[WIP] Migrate Webpack 4 support branch
You can now install webpack 4 support via @next!!!!!!! Enjoy!
Adding myself to the contributors list in npm packages.
…loaders Before adding hot reloading to the loader stack, make sure the build has some reference to hot reloading either in the entry-points or devServer
feat(src/index.js): Check for hot reloading before adding hot loaders Before adding hot reloading to the loader stack, make sure the build has some reference to hot reloading either in the entry-points or devServer
Mergeing the new documentation with the old for a more concise read. Updating the example code and the perks of our plugin
Adding collapsible content blocks to some of the longer topics, just displaying the hard hitting info
Finally extracted all relevant documentation. Still needs some formatting
More stats added
Fixing them
Only attempt to inject HOT if in development, as a safety to production builds
ScriptedAlchemy
changed the title
|
I need to test this with the rest of universal and start pushing those for PR if needed |
| const isHOT = isHMR(compiler); | ||
|
|
||
| if (isHOT && compiler.options.module && compiler.options.module.rules) { | ||
| const updatedRules = compiler.options.module.rules.reduce((rules, rule) => { |
There was a problem hiding this comment.
@faceyspacey any ideas man. Its stable but looks off to me
There was a problem hiding this comment.
what looks off? its automatically adding the hotloader if its using the css loader.
There was a problem hiding this comment.
Essentially yes, is this the most optimal method of accessing the compiler's loaders? Other than that, im fine with it. Just checking if you know about something like prependLoader. If not then all good
There was a problem hiding this comment.
na, i've seen this pattern of rewriting the rules at least once or twice before.
removed logos till we fact check
There was a problem hiding this comment.
dizzam, so basically is this HMR added to mini-extract? is there stuff that was added that doesnt make sense in mini-extract? it's very nice to have it under our roof, but im concerned that perhaps at the end of the day this belongs under the mini extract roof. Is there stuff here they're likely not to want (which by the way is the only reason I forked last time, and very likely a possibility again)? Can you describe in detail how this differs from mini extract?
|
oh, and if it's not clear, FUCKIN ROUND OF APPLAUSE! Well done @zackljackson |
|
So I was thinking about opening a PR back to mini-css extract - but theres a lot of people who already use and depend on our repo. It would be good to give it a webpack 4 upgrade, so the users can just update. I'd also like to keep a solution under our domain in the event that I need more than mini-css can offer. I do want to open this to mini-css, but id also like to release it here first |
|
ok. proceed. all this stuff is intended for cross-polination anyway. this can be the breeding ground. ..but also, i think mini extract itself is a stopgap and webpack is supposed to have full built-in support for css or something. in other words: webpack's css solution is likely to change, so i think it's a good thing that we stay steady continuing to fulfill our traditional role. |
|
Agreed. Ill open a PR to them soon - but as you said mini-css is totally a stopgap. It'll be good to maintain control of our architecture till a stable replacement is made ready in webpack |
# Conflicts: # index.js
Webpack 4 support for extract-css-chunks universal-component react-universal. Complete with full
chunking, code splitting, real and true hot module reloading. Compatible with faceyspacey universal
code splitting and server-side rendering.
Pretty much its great chunking like before, with really slick HMR. Putting it all together. The only plugin that does both css code splitting and HMR 👍
From Readme:
Perks
BREAKING CHANGE: EVERYTHING! This its a complete rewrite. Top to bottom!! This is a major change to the API and Loader. It will intergrate with universal without a issue and IT DOES NOT RELY ON
UNIVERSAL COMPONENTS.
fix #60, re #36 #47 #51