Description
Version: 1.0.0
Do you want to request a feature or report a bug?
Bug
What is the current 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.
I tested the second case 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.
If the current behavior is a bug, please provide the steps to reproduce.
I have created a minimal reproducible project with this issue
https://github.com/ivensgoncalves/Webpack_StylesDuplication
To test with style-loader, execute "npm run start1"
To test with mini-css-extract-plugin, execute "npm run start2"
What is the expected behavior?
It shouldn't duplicate css class.
Please mention other relevant information such as your webpack version, Node.js version and Operating System.
Node.js: v8.11.3
Webpack: v4.19.1
Operating System: Windows 10
Thanks in advance.
Best Regards,
Ivens Gonçalves.