"Composes" duplicating css (again)

[vlazh]

• webpack Version: 4.19.1
• css-loader Version: 3.4.1

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"

[alexander-akait]

/cc @jquense looks you are right about dedupe same modules in one module

[alexander-akait]

/cc @vlazh @jquense please test https://github.com/webpack-contrib/css-loader/releases/tag/v3.4.2

[jquense]

working for me 👍

[vlazh]

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.

[jquense]

@vlazh make sure you also have style-loader installed that is less than 1.1.0

[vlazh]

@jquense, I have latest version of style-loader installed. What the problem with v1.1.0?

[vlazh]

I have just managed to demonstrate the problem.
Demo project: https://github.com/vlazh/css-dublication
Run start:client script.

Class .CompB__children--10ad6 is duplicating.
In my real project, some css classes are duplicated as many times as there are links to css file.

[alexander-akait]

@vlazh please use style-loader less than 1.1.0, we have some problems with latest version, i will fix it in near future

[vlazh]

@evilebottnawi with style-loader@1.0.2 works great!
Thank you!
Worth it to create a new issue for the problem with style-loader or it already exists?

[alexander-akait]

@vlazh already exists

[vlazh]

@evilebottnawi, seems like fixed in style-loader@1.1.3. Thank you!