reactjs - 如何将 css 模块与 create-react-app 一起使用？

Question

根据tweet作者:Dan Abramov，create-react-app (CRA) 中提供了 CSS 模块支持。只需要为其样式表提供 module.css 扩展即可启用该功能，但这对我不起作用。我使用的是 react-scripts 版本 1.1.4。如何使用 CRA 启用 css 模块？谢谢

Answer 1

您不需要弹出。

Create React App 从版本 2 开始就支持 CSS 模块。

升级到latest (react-scripts@latest)版本。

如果您使用 yarn :

yarn upgrade react-scripts@latest

如果你使用 npm:

npm install --save react-scripts@latest

然后你只需创建一个扩展名为.module.css的文件

例如:

.myStyle {
  color: #fff
}

然后你可以像这样使用它:

import React from 'react'
import styles from './mycssmodule.module.css'

export default () => <div className={styles.myStyle}>We are styled!</div>