样式
在 React 中使用样式并不是由 React 控制的,而是由打包工具 Webpack 负责管理的。只用于组件的样式文件可以在组件定义文件中使用import
直接载入,Webpack 在打包时会自动进行提取。
或者还可以使用react-scripts
中提供的 CSS 模块功能来为组件指定 CSS 文件,这只需要遵守组件 CSS 文件的命名规约即可。例如有一个组件名为Button.js
,那么其 CSS 模块文件的名称就为Button.module.js
。即 CSS 模块文件的命名规则为[name].module.css
。React Scripts 会自动处理模块中的 CSS 样式类名称。