Dynamic classname in css file

[yogesh45]

I am adding a scss file for my component

But after compiled in dist/index.css file the classname added inside my scss files get changed

SCSS : .selected{ background-color: blue; color: white; } .blured{ color: #ccc; opacity: 0.5; pointer-events: none; } .header{ width: 100px; }

Index.css ._NBCalender__selected__2iz2b{ background-color: blue; color: white; } ._NBCalender__blured__2dYaJ{ color: #ccc; opacity: 0.5; pointer-events: none; } ._NBCalender-style__selected__tbQ82 { background-color: blue; color: white; }

._NBCalender-style__blured__2f44- { color: #ccc; opacity: 0.5; pointer-events: none; }

._NBCalender-style__header__3kezG { width: 100px; }

Is there any way to fix this

[sadu]

For some reason microbundle-crl treats *.scss files like modules and does this. Disabling css modules fixes this problem: https://github.com/developit/microbundle#css-and-css-modules

so in your package.json change the scripts to

    "build": "microbundle-crl --no-compress --no-css-modules --format modern,cjs",
    "start": "microbundle-crl watch --no-compress --no-css-modules --format modern,cjs",

[gabriel-visualthinking]

For some reason microbundle-crl treats *.scss files like modules and does this. Disabling css modules fixes this problem: https://github.com/developit/microbundle#css-and-css-modules

so in your package.json change the scripts to

    "build": "microbundle-crl --no-compress --no-css-modules --format modern,cjs",
    "start": "microbundle-crl watch --no-compress --no-css-modules --format modern,cjs",

Thank you! This did indeed work. Only problem is that now I can't use modules, so not the ideal solution, but I can make it work. I'm assuming there's no way to use both right?