sass学习

概述

Sass 是一款强化 CSS 的辅助工具，它在 CSS 语法的基础上增加了变量 (variables)、嵌套 (nested rules)、混合 (mixins)、导入 (inline imports) 等高级功能，这些拓展令 CSS 更加强大与优雅。使用 Sass 以及 Sass 的样式库有助于更好地组织管理样式文件，以及更高效地开发项目。

https://www.sass.hk/

实践

安装：

cnpm install -g sass

添加测试input.scss:

.container {
    .main {
        color: #000;
    }
}

生成css文件

sass input.scss output.css

查看css文件output.css：

.container .main {
  color: #000;
}

在vue项目中安装：

pnpm add sass -D

一般在创建时就选择了sass。