Open meglio opened 3 years ago
Some more insight:
Here is how the options.content
is generated by generic-names/index.js/function generate()
, which is used by your plugin.
var loaderOptions = {
content:
hashPrefix +
path.relative(context, filepath).replace(/\\/g, "/") +
"+" +
localName,
context: context
};
You are using generic-names
of version ^2.0.1
.
I can confirm that generic-names
of version 3.0.0
uses \x00
instead:
https://github.com/css-modules/generic-names/blob/0915569bf4bbeb4130723cff45e2b5c5d3702cf4/index.js#L37
Please check if this pull request can be accepted:
https://github.com/gajus/babel-plugin-react-css-modules/pull/303
For anyone finding this, see comment in PR. Seems best to just stop using this package. I tried this one and it works well!
Content hashes in css class names generated by this plugin are not the same as the hashes generated by
css-loader
.Example:
babel-plugin-react-css-module
=>navbar__container___2dO7z
css-loader
=>navbar__container___ocJ3d
Debugging webpack reveals the reason - the
options.content
values used are different. Example (actual library name replaced byxxx
):content
value used bybabel-plugin-react-css-module
:content
value used bycss-loader
:In the second value above,
[NIL]
is\x00
This
\x00
character is used incss-loader/dist/utils.js
like this:Versions: