meteor-css-modules
meteor-css-modules copied to clipboard
White space problem
This isn't really an issue with CSS Modules, but it took me a few minutes to figure out what's going on.
I had a perfectly working page in my app, hadn't touched it in ages.
Then I setup class naming convention as instructed in your docs,
"cssClassNamingConvention": {
"template": "${name}--${hasha(scopedName, {algorithm: 'md5'}).substring(0, 9)}"
}
Suddenly my page is all wonky.
Turns out, I had a white space character in my css
-file that wasn't actually white space.
It didn't cause issues until I setup class naming convention.
After I erased the character camouflaged as white space and actually inserted white space => back to normal.
Not sure if this is something worth noting, feel free to close the issue if it's irrelevant.
Do you happen to know what that character was? I'm guessing that it doesn't cause any issues as long as it's at the end of the line because the browser ignores it, but when you adjusted the naming convention as shown above it got stuck in the middle of the generated class name. Probably all I need to do is look into what characters are legal for CSS class names and strip any that aren't, and likely also report the issue for the postcss plugin that's handling the transform.
Sure! Apparently it's a non-breaking space, whom we know better as
from the old days.