使用scss预处理器

闲暇之余不忘学习，提升自己 ，知识在于积累，更是一笔财富。

看完文章，感谢各位支持一下呗！

SASS 是一种预编译的 CSS，作用类似于 Less。由于 React 中内置了处理 SASS 的配置，所以，在 CRA 创建的项目中，可以直接使用 SASS 来写样式。

Sass 是一个 CSS 的扩展，它在 CSS 语法的基础上，允许您使用变量 (variables), 嵌套规则 (nested rules), 混合 (mixins), 导入 (inline imports) 等功能，令 CSS 更加强大与优雅。使用 Sass 以及 Compass 样式库 有助于更好地组织管理样式文件，以及更高效地开发项目。

特色 (Features)

• 完全兼容 CSS3
• 在 CSS 语言的基础上增加变量(variables)、嵌套 (nesting)、混合 (mixins) 等功能
• 通过函数进行颜色值与属性值的运算
• 提供 控制指令等高级功能
• 自定义输出格式

实现步骤

1. 安装解析 sass 的包：yarn add sass -D

2. 创建全局样式文件：index.scss

   body {
     margin: 0;
   }
   
   #root {
     height: 100%;
   }