-
-
Notifications
You must be signed in to change notification settings - Fork 604
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
"Composes" duplicating css (again) #1037
Comments
/cc @jquense looks you are right about dedupe same modules in one module |
working for me 👍 |
Example project work fine, but in my real project still has dublicating in some cases. Unfortunately I can't reproduce it in example project. I use typescript, react and a lot of components. I continue to research, but still have no success. |
@vlazh make sure you also have style-loader installed that is less than 1.1.0 |
@jquense, I have latest version of style-loader installed. What the problem with v1.1.0? |
I have just managed to demonstrate the problem. Class |
@vlazh please use style-loader less than 1.1.0, we have some problems with latest version, i will fix it in near future |
@evilebottnawi with [email protected] works great! |
@vlazh already exists |
@evilebottnawi, seems like fixed in [email protected]. Thank you! |
It's copy of #772 but with latest css-loader.
Expected Behavior
It shouldn't duplicate css class.
Actual Behavior
When a class name within a css file is shared using "composes" in a 2 degree level, it gets duplicated (when each class has its own file).
For example (each class has its own css file):
Case 1 (composes in 1 degree level)
"primary-button" which composes "button" and;
"secondary-button" which composes "button".
This case is ok, and nothing gets duplicated.
Case 2 (composes in 2 degree level)
"next-button" which composes "primary-button" which composes "button" and;
"back-button" which composes "secondary-button" which composes "button".
On this case, the "button" class gets duplicated.
The second case was tested with the following plugins:
style-loader (see print): https://raw.githubusercontent.com/ivensgoncalves/Webpack_StylesDuplication/master/prints/style-loader.png
mini-css-extract-plugin (see print): https://raw.githubusercontent.com/ivensgoncalves/Webpack_StylesDuplication/master/prints/mini-css-extract-plugin.png
On both plugins the "button" class got duplicated.
Code
With latest css-loader:
https://github.com/vlazh/Webpack_StylesDuplication
How Do We Reproduce?
A minimal reproducible project with this issue:
https://github.com/vlazh/Webpack_StylesDuplication
To test with style-loader, execute "npm run start1"
To test with mini-css-extract-plugin, execute "npm run start2"
The text was updated successfully, but these errors were encountered: