javascript - css-loader 3.4.2中通过localsConvention的kebab-case到camelCase不起作用

Question

出于测试/学习目的，我使用了 create-react-app 3.4.1 的弹出版本。附带css-loader 3.4.2 , 我正在尝试重现 these results其中 css 选择器是用 kebab-case 编写的，但是 js 样式对象将它们转换为 camelCase:
样式.css

.foo-baz {
  color: red;
}
.bar {
  color: blue;
}

index.js

import styles from './styles.css';

console.log(styles);
// expected result: { fooBaz, bar }
// actual, default results: { foo-baz, bar }

根据 css-loader changelog在 3.0.0 版中:

exportLocalsStyle option was remove in favor localsConvention option, also it is accept only {String} value (use 'camelCase' value if you previously value was true and 'asIs' if you previously value was false)

所以我试着这样做:
webpack.config.js

...
{
  test: cssRegex,
  exclude: cssModuleRegex,
  use: getStyleLoaders({
    importLoaders: 1,
    sourceMap: isEnvProduction && shouldUseSourceMap,
    localsConvention: "camelCase", // my only addition is this line
  }),
  sideEffects: true,
},
...

运行 npm start和 npm run build两者都成功，但是转换没有发生，我仍然在我的 js 文件中遇到了 kebab-case，即使添加了 console.log(styles)在我的 App.js 文件中，打印到控制台的输出对象仍然是 kebab-case 键和后续的 kebab-case 值。
我在这里错过了什么吗？也许很可能我对css前/后编译过程没有清楚的了解，我试图在错误的地方注入(inject)这个逻辑？有没有人在 css-loader 3.* 中有一个使用这个 kebab 到 camelCase 功能的工作示例？ ?
旁注:我不想更新 css-loader打包到它的最新版本，我打算将此信息带回非弹出 create-react-app然后使用 craco 更新配置- 我必须改变的越少越好。

Answer 1

我在模块部分通过 exportLocalsConvention 解决了这个问题:

{
    loader: 'css-loader',
    options: {
        modules: {
            localIdentName: '[name]_[local]_[hash:base64:6]',
            exportLocalsConvention: 'camelCase'
        }
    }
},