reactjs NextJS更改Nextjs生成的类名

s3fp2yjn  于 2023-04-11  发布在  React
关注(0)|答案(1)|浏览(125)

下面是我的Heading组件的JSX

<h1 className={classes.defaultHeading}>This is a heading</h1>

当我在浏览器中检查元素时,它看起来像这样:

<h1 class="heading_defaultHeading__Rr0GL">This is a heading</h1>

我希望classname格式只是classname --例如,我希望上面的generared代码看起来像这样:

<h1 class="defaultHeading">This is a heading</h1>

我如何才能做到这一点?

cbwuti44

cbwuti441#

而不是使用CSS Modules,这将 * 自动创建一个唯一的类名 *(对组件级css有用)。
考虑将尽可能多的普通css样式表导入到pages/_app.js文件中:

global.css

.defaultHeading {
  background-color: red;
}

一米二米一x

import '../global.css'
import '../other-css-files.css'

export default function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

components/Heading.jsx

<h1 className="defaultHeading">This is a heading</h1>

相关问题