在 Next.js 中配置 postcss 模块加载器以转换烤肉串案例类

Question

似乎您可以配置 webpack 的 css 加载器，将样式表中的类名从烤肉串大小写转换为骆驼大小写(见这里 https://github.com/webpack-contrib/css-loader#localsconvention(

如何配置 Next.js 来实现此目的？

我尝试像这样修改 webpack 配置，但它破坏了应用程序：

module.exports = {
// Modify webpack config
webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
config.module.rules.push({
test: /.module.css$/i,
use: [
'style-loader',
{
loader: 'postcss-loader',
options: {
modules: true,
localsConvention: 'camelCase',
},
},
],
})
return config
},
}

Answer 1

我认为这是Next中的一个实时问题.js并且关于它的讨论正在进行中(很长一段时间(： CSS 模块 - 自动将类名转换为驼峰大小写 #11267

不幸的是，我最近遇到了这个问题，还没有找到任何解决方案。