较新的版本不需要配置sass-loader等一系列插件，安装即用。更改app.css为app.scss,并删除其中全部内容，使用如下代码替换app.tsx中的内容

Sass提供了许多内置模块，其中包含有用的函数（以及mixin）。这些模块可以像任何用户定义的样式表一样使用@use规则加载，它们的函数可以像任何其他模块成员一样调用。所有内置模块URL都以sass开头

如果需要使用变量，同时又要确保 / 不做除法运算，而是完整地编译到 CSS 文件中，这种情况怎么办？？？可以使用 #{} 插值语句将变量包裹。

sass 运算符虽然没有像那些编程语言那么强大，但为了更灵活的输出css，也增强了一些运算符的功能，例如赋值运算符、等号操作符、比较运算符、逻辑运算符、字符串运算符

混合指令（Mixin）用于定义可重复使用的样式，避免了使用无语意的 class，比如 .float-left。混合指令可以包含所有的 CSS 规则，绝大部分 Sass 规则，甚至通过参数功能引入变量，输出多样化的样式。

通过观察不同的输出格式可以看出，compressed – 压缩格式 转出的文件是最小的，所以该格式通过为项目发布时设置的格式，开发阶段为了更好地观察编译结果，通过设置为expanded – 展开格式，也可以设置为compact – 紧凑格式

Sass 是一个 CSS 预处理器，完全兼容所有版本的 CSS。实际上，Sass 并没有真正为 CSS 语言添加任何新功能，只是在许多情况下可以可以帮助我们减少 CSS 重复的代码，节省开发时间

在前端开发中，使用css来写样式，由于目前css没有变量，也没有条件语句，难免有些麻烦，因此有了CSS预处理器，Sass便是其中之一。

玩玩Sass 自带的一些函数...有字符串函数(String Functions)、数字函数(Number Functions)、列表函数(List Functions)、颜色函数(Color Functions)、Introspection 函数(Introspection Functions)、三元函数(Miscellaneous Function)

Sass 定义了各种类型的函数，这些函数可以通过 CSS 语句直接调用。可以看到Sass的函数功能已经相当丰富了。整理了Sass的主要函数，重点在于后面的颜色函数，设计非常的银杏！

最近，有一则非常振奋人心的消息，CSS 即将原生支持嵌套 -- Agenda+ to publish FPWD of Nesting，表示 CSS 嵌套规范即将进入规范的 FWPD 阶段。

本节我们来看一下 Sass 中的颜色函数，颜色函数可以分为三部分，分别是颜色设置、颜色获取以及颜色操作。Sass 中的颜色函数有很多，下面我们来看一些 Sass 中常用的颜色函数：

本节我们学习 Sass 中的循环语句，Sass 中的循环语句可以使用 @for 指令和 @while 指令来实现。@for 指令可以用于循环生成样式，@for 指令有两种类型

Sass 是成熟、稳定、强大的专业级 CSS 扩展语言。它兼容 CSS、功能丰富、社区庞大，为业界认可，被广泛应用；本文将根据使用 Sass 存在的痛点，以及更好的替代品，来陈述个人观点：不推荐使用 scss 作为 css 预处理器，更倾向于使用 Less 或 Stylus。

JavaScript 和 CSS 已经并存超过了 20 年。但是在它们之间共享数据非常困难。当然也有大量的尝试。但是我所想到的是一些简单而直观的内容——不涉及结构更改，而是使用 CSS 自定义属性甚至 Sass 变量。