parcel-plugin-typed-css-modules icon indicating copy to clipboard operation
parcel-plugin-typed-css-modules copied to clipboard

Runtime property names have hyphens, while d.ts is camel cased.

Open saabi opened this issue 7 years ago • 3 comments

The following CSS:

#app-root { ... }
.widget { ... }
.ticker { ... }
.ticker .selected { ... }
.positive { ... }
.negative { ... }

generates the following d.ts with names camel cased:

export const appRoot: string;
export const widget: string;
export const ticker: string;
export const selected: string;
export const positive: string;
export const negative: string;

But during runtime, the hyphens remain and there is no camel cased alternative:

image

saabi avatar Nov 10 '18 14:11 saabi

For that you need to update how parcel generates module class names. My .postcssrc file looks like this:

{
  "modules": true,
  "plugins": {
    "autoprefixer": {
      "grid": true
    },
    "postcss-modules": {
      "generateScopedName": "[name]_[local]_[hash:base64:5]",
      "camelCase": true
    }
  }
}

bogdan-zaharia-hs avatar Jan 30 '19 12:01 bogdan-zaharia-hs

"camelCase": true this should be in the readme. Currently ended with my bug here and this sovled. Thanks

FDiskas avatar May 16 '19 15:05 FDiskas

Thanks for the fix @bogdan-zaharia-hs I definitely agree, this should end up in the Readme!

toniopelo avatar Jun 15 '19 19:06 toniopelo