Sass的安装与使用经验

       关于Sass的使用对于刚学前端的朋友来说，可能会有小小的低触。因为已经学习CSS,为什么还要研究Sass。但是为了技术全面的完善。还是要努力研究一下。

简单引用介绍：Sass是对CSS的扩展，让CSS语言更强大，优雅。它有助于保持大型样式表结构良好，同时也让你能够快速开始小型项目，特别是在搭配样式库一同使用时。

本人为Mac系统，所以就记录了一下自己的Mac对Sass的安装方法：

Sass有三种使用方式：命令行工具，独立的Ruby模块，以及包含Ruby on Rails 和 Merb作为支持Rack的框架的插件。也不懂什么模块，框架。就果断用命令行了。第一步安装 Sass gem:

终端 terminal.app 执行如下：

gem install sass

出现错误是正常的，因为在这装插件或应用程序的话。你必须有安装权限。代码修改如下：

sudo gem install sass

简单一行，sass就安装成功。 但是现在还不能运行使用。还需要在nginx 的mime.types里添加识别类型代码。找到文件目录如下图：

图中选中文件即是需要修改文件目录。但是发现无法直接修改文件。至于mine.types的修改，必须是在桌面上拷贝原文件，找开拷贝在桌面上的mine.types文件进行修改， 然后再拷贝回原目录， 覆盖原文件。

mime.types中添加识别类型代码如下图中蓝色背景内容：

由上图可以知道 左边为类型属性，右边为原使的识别类型。

安装sass结束，项目中的所有css文件改为目录为sass目录下，扩展名为".scss"的文件。之后项目即为基于sass的项目。至于生成的.scss文件，项目还需要为其添加监视生成文件。此命令需要在项目sass同一级别目录下执行。

注意：可以更新监视一个文件， 也可同时更新多个。

sass input.scss output.css

input.scss为你的输入样入， output.css为编译后样式，便于理解的样式。

sass --watch app/sass:public/stylesheets

上面的代码即为public整个目录下的所有样式可以进行监视。

好了，这些就是sass安装使用的个人经验。至于sass的强大语法，太过丰富与强大，此文就不介绍。可以查看：http://sass-lang.com/documentation/file.SASS_REFERENCE.html   官方文档。

注：scss 是sass的一个分支。 文件生成的扩展名不同，书写语法不一样。sass是在scss的基础上继续简化的一种书写样式。建议学习scss熟练之后，再使用sass。 scss 更接近于css的书写样式。