使用Sass(UsingSass)-插件，缓存，配置选项，语法选择及编码格式_html/css_WEB-ITnose

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了使用Sass(UsingSass)-插件，缓存，配置选项，语法选择及编码格式_html/css_WEB-ITnose，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含9402字，纯文字阅读大概需要14分钟。

内容图文

翻译自官方文档： http://sass-lang.com/documentation/file.SASS_REFERENCE.html#using_sass

Sass 有三种使用方式：作为命令行工具，作为独立的 Ruby 模块 (Ruby module)，或者作为 Rack-enabled 框架的插件，包括 Ruby on Rails 与 Merb。无论使用哪种方式都需要首先安装 Sass gem ：

gem install sass

如果你使用的是Windows ，你可能首先需要 安装Ruby。

如果要在命令行中运行 Sass ,只要使用

sass input.scss output.css

你还可以使用Sass命令来监视某个Sass文件的改动，并自动编译来更新 CSS ：

sass --watch input.scss:output.css

如果你的目录里有很多 Sass 文件，你也可以使用Sass命令来监视整个目录：

sass --watch app/sass:public/stylesheets

使用 sass --help可以列出完整的帮助文档。

在 Ruby 中使用 Sass 也非常容易，Sass gem 安装完毕后，用它运行 require "sass"， 然后按照下面的方法使用 Sass::Engine：

engine = Sass::Engine.new("#main {background-color: #0000ff}", :syntax => :scss)engine.render #=> "#main { background-color: #0000ff; }\n"

Rack/Rails/Merb 插件（Plugin）

在 Rails 3 之前的版本中启用 Sass，需要在 environment.rb 文件中添加一行代码：

config.gem "sass"

对于 Rails 3，则是把这一行加到 Gemfile 中：

gem "sass"

要在 Merb 中启用 Sass，需要在 config/dependencies.rb文件中添加一行代码：

dependency "merb-haml"

在 Rack 应用中启用 Sass，需要在 config.ru文件中添加以下代码：

require 'sass/plugin/rack'use Sass::Plugin::Rack

Sass 样式表跟视图（views）的工作方式不同。 它不包含任何动态内容， 因此只需要在 Sass 文件更新时生成 CSS 即可。 默认情况下， .sass和 .scss文件是放在 public/stylesheets/sass 目录下的（这可以通过选项进行配置）。 然后，在需要的时候，它们会被编译成相应的 CSS 文件并被放到 public/stylesheets 目录下。 例如，public/stylesheets/sass/main.scss 文件将会被编译为 public/stylesheets/main.css 文件。

缓存 (Caching)

默认情况下，Sass 会自动缓存编译后的模板（template）与，这样做能够显著提升重新编译的速度，在处理 Sass 模板被切割为多个文件并通过导入，形成一个大文件时效果尤其显著。

如果不使用框架的情况下，Sass 将会把缓存的模板放入 .sass-cache目录。 在 Rails 和 Merb 中，缓存的模板将被放到 tmp/sass-cache目录。 此目录可以通过选项进行自定义。 如果你不希望 Sass 启用缓存功能， 可以将选项设置为 false。

配置选项 (Options)

选项可以通过设置的 Sass::Plugin#optionshash，具体设置在Rails中的 environment.rb或者Rack中的 config.ru的文件中：

Sass::Plugin.options[:style] = :compact

或者，如果你使用Merb，那么可以在 init.rb文件中设置 Merb::Plugin.config[:sass]hash ：

Merb::Plugin.config[:sass][:style] = :compact

或者通过传递一个选项 (options) hash 给 Sass::Engine#initialize，

所有相关的选项也可通过标记在 sass和 scss命令行可执行文件中使用。可用选项有：

选项	描述
:style	设置输出CSS的代码风格，可以查看。
:syntax	输入文件的语法， :sass表示缩进语法， :scss表示CSS扩展语法。只有在你自己构造 Sass::Engine实例的情况下有用；当你使用 Sass::Plugin时，它会自动设置正确的值。默认设置为 :sass。
:property_syntax	强制缩进语法文档使用一个属性语法。如果不使用正确的语法，将抛出一个错误。 :new值表示强制在属性名后面使用一个冒号。例如： color: #0f3或者 width: $main_width。 :old值表示强制在属性名前面使用一个冒号。例如： :color #0f3或者 :width $main_width。默认请客下，两种语法都是有效的。该选项对于SCSS（ .scss）文档是无效的。
:cache	解析 Sass 时是否应该缓存，允许更快的编译速度。默认设置为 true。
:read_cache	如果设置了这个选项，而没有设置 :cache选项，那么缓存存在就只读 Sass 缓存，如果没有没有缓存，那就不会编译。
:cache_store	如果该选项设置为 Sass::CacheStores::Base的子类的实例，该缓存存储将被用于存储和检索缓存编译结果。默认设置为 Sass::CacheStores::Filesystem，初始化使用。
:never_update	CSS文件永远不应该被更新，即使是模板（template）文件改变。将其设置为 true可能会带来小的性能提升。它总是默认为 false。该选项只有在Rack，Ruby on Rails，或Merb中有意义。
:always_update	CSS文件总是应该进行更新，即使是在每一个控制器被访问时，而不是只当模板被修改时更新。默认为 false。该选项只有在Rack，Ruby on Rails，或Merb中有意义。
:always_check	Sass模板总是应该被检查是否更新，即使是在每一个控制器被访问时，而不是只在服务启动时。如果一个Sass模板（template）被更新，它会被重新编译并且覆盖相应的CSS文件。在生产模式中默认为 false，否则 true。该选项只有在Rack，Ruby on Rails，或Merb中有意义。
:poll	如果为 true，始终使用 Sass::Plugin::Compiler#watch后端轮询而不是本机文件系统的后端。
:full_exception	Sass代码中错误是否应该在生成的CSS文件中提供详细的说明。如果设置为 true，这个错误将显示在CSS文件的注释中 和页面顶部（支持的浏览器），错误内容包括行号和源代码片段。 否则，异常将在Ruby代码中提醒。在生产模式中默认为 false，否则 true。
:template_location	一个路径，应用根目录中Sass模板（template）的目录。如果散列， :css_location将被忽略，并且这个选项指定输入和输出目录之间的映射。也可以给定二元列表，代替散列（hash）。默认为 css_location + "/sass"。该选项只有在Rack，Ruby on Rails，或Merb中有意义。请注意，如果指定了多个模板位置，它们全部都放置在导入路径中，允许你在它们之间进行导入。 需要注意的是，由于它可以采用许多可能的格式，这个选项应该只直接设置，不应该被访问或修改。使用 Sass::Plugin#template_location_array， Sass::Plugin#add_template_location， Sass::Plugin#remove_template_location方法来代替。
:css_location	CSS文件输出的路径，当 :template_location选项为一个散列（hash）时，这个选项将被忽略。默认设置为 "./public/stylesheets"。该选项只有在Rack，Ruby on Rails，或Merb中有意义。
:cache_location	其中，高速缓存 sassc文件应写入的路径。在Rails和Merb中默认为 "./tmp/sass-cache"，否则默认为 "./.sass-cache"。如果设置了，这个将被忽略。
:unix_newlines	如果为true，写入文件时使用Unix风格的换行符。只有在Windows上，并且只有当Sass被写入文件时有意义（在 Rack, Rails, 或 Merb中，直接使用 Sass::Plugin时，或者使用命令行可执行文件时）。
:filename	被渲染文件的文件名。这完全是用于报告错误，使用Rack, Rails, or Merb时自动设置。
:line	Sass模板（template）第一行的行号。用于报告错误的行号。如果Sass模板（template）嵌入一个Ruby文件中，这个设置是很有用的。
:load_paths	一个数组，包含文件系统 或 通过指令导入的 Sass模板（template）路径。他们可能是字符串， Pathname（路径名）对象或者是 Sass::Importers::Base的子类。该选项默认为工作目录，并且在Rack, Rails, 或 Merb中，该选项无论如何值都是 :template_location。加载路径也可以由 Sass.load_paths和 SASS_PATH环境变量通知。
:filesystem_importer	一个 Sass::Importers::Base的子类，用来处理普通字符串的加载路径。这应该从文件系统导入文件。这应该是一个通过构造函数带一个字符串参数（加载路径），继承自 Sass::Importers::Base的Class对象。默认为 Sass::Importers::Filesystem。
:sourcemap	控制如何生产sourcemap。这些sourcemaps告诉浏览器如何找到Sass样式，从而生成每一个CSS样式。该选项有三个有效值： :auto 在可能的情况下使用相对URI，假设在你使用的任何服务器上提供的源样式，那么它们的相对位置将和本地文件系统是相同的。如果一个相对URI不可用，那么将被”file:”替换。 :file 总是使用”file:” URI，这将在本地工作，但不能被部署到一个远程服务器。 :inline 包含sourcemap中完整的源文本，这是最方便的，但是可能生产非常大的sourcemap文件。 最后， :none 会导致总是不会生成sourcemap文件。
:line_numbers	当设置为 true的时候，定义的选择器的行号和文件名 将被作为注释注入到编译的CSS中。这对调试来说是有用的，特别是使用和的时候。这个选项有个别名叫做 :line_comments。当使用 :compressed输出样式或使用 :debug_info/ :trace_selectors选项时这个选项将自动禁用。
:trace_selectors	当设置为 true的时候，将在每个选择器之前注入和的完整轨迹。在浏览器中调试通过和包含进来的样式表时是很有用的。此选项将取代 :line_comments选项，并且被 :debug_info选项取代。当使用 :compressed输出样式时，这个选项将自动禁用。
:debug_info	当设置为 true的时候，定义的选择器的行号和文件名 将被注入到编译后的CSS中,可以被浏览器所识别。用于 FireSass Firebug 扩展，以显示Sass文件名和行号。当使用 :compressed输出样式时，这个选项将自动禁用。
:custom	这个选项可用于单个应用程序设置以使数据可用于 定制Sass功能。
:quiet	当设置为 true的时候，导致禁用警告信息。

语法选择（Syntax Selection）

Sass命令行工具将使用文件扩展名以确定你使用的是哪种语法，但并不总是一个文件名。 sass命令行程序默认为缩进语法，但如果输入应该被解析为SCSS语法，你可以传递 --scss选项给她。此外，你可以使用 scss命令行程序，它和 sass程序完全一样，但是他的默认语法为SCSS。

编码格式 (Encodings)

在 Ruby 1.9 及以上环境中运行 Sass 时，Sass 对文件的编码格式比较敏感，首先会根据 CSS spec判断样式文件的编码格式， 如果失败则检测 Ruby 字符串编码。也就是说，Sass 首先检查 Unicode 字节顺序标记，然后是 @charset声明，最后是 Ruby 字符串编码，假如都没有检测到，默认使用 UTF-8 编码。

要明确指定样式表的编码，与 CSS 相同，使用 @charset声明。在样式文件的起始位置（前面没有任何空白与注释）插入 @charset "encoding-name";， Sass 将会按照给定的编码格式编译文件。注意，无论你使用哪种编码，它必须可以转换为 Unicode 字符集。

默认情况下，Sass 总会以UTF-8编码输出 CSS 文件。当且仅当输出文件包含非ASCII字符时，才会在输出文件中添加 @charset声明，在压缩模式中，而在压缩模式下 (compressed mode) 使用 UTF-8字节顺序标记代替 @charset 声明语句。

内容总结

以上是互联网集市为您收集整理的使用Sass(UsingSass)-插件，缓存，配置选项，语法选择及编码格式_html/css_WEB-ITnose全部内容，希望文章能够帮你解决使用Sass(UsingSass)-插件，缓存，配置选项，语法选择及编码格式_html/css_WEB-ITnose所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---