如何在原生html,css中使用Sass

如何在原生html,css中使用Sass

1、Sass的安装

sass是用Ruby语言写的，但是两者的语法没有关系，所以学 Sass 不用学 Ruby，只是必须先安装Ruby，然后再安装Sass。
ruby官网：https://rubyinstaller.org/downloads/

安装完成后查看ruby版本号确定安装成功

然后输入gem install sass进行sass的安装。

如出现错误请访问https://www.sass.hk/install/

2、开始使用sass来编译

打开ruby命令窗口并进入到相关目录

命令行编译
//单文件转换命令

sass input.scss output.css

//单文件监听命令

sass --watch input.scss:output.css

//如果你有很多的sass文件的目录，你也可以告诉sass监听整个目录：

sass --watch app/sass:public/stylesheets

命令行编译选项
/编译格式

sass --watch input.scss:output.css --style compact

//编译添加调试map

sass --watch input.scss:output.css --sourcemap

//选择编译格式并添加调试map

sass --watch input.scss:output.css --style expanded --sourcemap

//开启debug信息

sass --watch input.scss:output.css --debug-info

////////////////////////////////////////////////////////////////////////////
–style表示解析后的css是什么排版格式;
sass内置有四种编译格式:
nested
expanded
compact
compressed。
“编译格式效果请看 https://www.sass.hk/install/”
–sourcemap表示开启sourcemap调试。开启sourcemap调试后，会生成一个后缀名为.css.map文件。
–sourcemap=none表示不生成.css.map文件