gajus / babel-plugin-react-css-modules

Transforms styleName to className using compile time CSS module resolution.
Other
2.05k stars 162 forks source link

Not compatible with css-loader@3.0.0 #258

Open ThiefMaster opened 5 years ago

ThiefMaster commented 5 years ago

I have localIdentName set to '[path]___[name]__[local]___[hash:base64:5]' in the css-loader, but as of 3.0.0 this generates a name (in css-loader) where slashes and dots aren't replaced with dashes but rather escaped.

That's a bit uglier to read now (anyway, they aren't really meant for humans) -- but the main problem is that this plugin now generates invalid className values because it's using the old logic.

Example:

className: rb-client-js-modules-landing-___Landing-module__landing-page-card___kz6iY css: .rb\/client\/js\/modules\/landing\/___Landing\.module__landing-page-card___kz6iY

krailler commented 5 years ago

Same error for me. 🙃

gajus commented 5 years ago

Good first PR.

krailler commented 5 years ago

I solved the problem with this...

const defaultGetLocalIdent = require('css-loader/dist/utils').getLocalIdent

modules: {
    ...
    getLocalIdent: (...params) => defaultGetLocalIdent(...params).replace(/\\\//g, '-'),
    ...
}
purefun commented 3 years ago

Currently, css-loader@v3.4.2 doesn't export getLocalIdent anymore.