preactjs / preact-cli

😺 Your next Preact PWA starts in 30 seconds.
MIT License
4.69k stars 375 forks source link

confused about mini-css-extract-plugin warning about conflicting order #1201

Open jliebrand opened 4 years ago

jliebrand commented 4 years ago

(I read the bug template, but this isn't a feature request nor a bug I don't think. Let me know if I should put this elsewhere.)

Probably relevant so listing here: I'm using preact-cli@3.0.0-rc.10 preact@10.4.1 sass-loader@7.3.1

We have a number of routes which compile in to chunks. But mini-css-extract-plugin seems to have a problem with order

Example warning:

⚠ WARN chunk route-App~route-MicroStepSignup [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ../node_modules../node_modules/preact-cli/lib/lib/webpack/proxy-loader.js??ref--6-0!./components/Toggle.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ../node_modules../node_modules/preact-cli/lib/lib/webpack/proxy-loader.js??ref--6-0!./components/ProgressBar.scss
   - couldn't fulfill desired order of chunk group(s) route-MicroStepSignup
   - while fulfilling desired order of chunk group(s) route-App

I've read numerous threads on this, where everyone seems to be confused by this, and I'll add my name to the list... Both Toggle.scss and ProgressBar.scss use their own name scope and nothing global. Sass should compile this so there should be no conflict. And if there is no conflict then the order should not matter either.

Am I missing something here?

rschristian commented 4 years ago

Do you happen to have an example project where this can be demonstrated?

From what I've read, the error message can be a bit hit or miss, sometimes requiring you look elsewhere for the issue. Maybe take a quick peek through your components' styles, make sure no duplicate scopes resulting from a copy/paste or similar?