如何在 CSS Modules 中使用 Sass 或 Less?
在 CSS Modules 中使用 Sass 或 Less 是一种常见的做法,可以利用这些预处理器提供的功能,如嵌套、变量和混入等。以下是如何在 React 项目中使用 CSS Modules 与 Sass 或 Less 的步骤。
使用 Sass
1. 安装 Sass
首先,你需要安装 Sass:
npm install sass
2. 创建 Sass Module 文件
创建一个以 .module.scss
结尾的文件。例如:
/* src/components/MyComponent.module.scss */
$primary-color: lightblue;
.myComponent {
background-color: $primary-color;
padding: 20px;
border-radius: 5px;
h1 {
color: darkslategray;
}
}