Module LESS results are different depending on use of grunt or setup:static-content:deploy
-
15-04-2021 - |
Frage
I am tying to break up my CSS, in a rather big module, so that it is easier to find the CSS I need. I have done something like the following in my _module.less
:
@import "module/_first-less";
@import "module/_second-less";
@import "module/_third-less";
It works fine if I run grunt commands and compile with grunt directly. However, when running bin/magento setup:static-content:deploy -f
like you would on production server (without -f
obviously) it seems to pick and choose what to apply out of them imports. I have checked other modules and I have seen similar being done elsewhere so I am a bit confused as to why this isn't working out for me.
I am running magento in Developer mode just in case that is any extra help.
UPDATE:
After further testing it doesn't look as if @import
is the issue. I have consolidated all the LESS into the one _module.less
& have the same issue. While using grunt the styles are all perfect. The issue is during bin/magento setup:static-content:deploy
.
Lösung
Believe it or not the following change fixed my issue:
- .media-width(@extremum, @break) when (@extremum ="max") and (@break =@screen__m) {. . .}
+ .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {. . .}
I'm not sure why one compiles fine and the other has issues it might be related to this issue: https://github.com/magento/magento2/issues/7231