您好,欢迎访问一九零五行业门户网

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

翻译自官方文档: 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 声明语句。
其它类似信息

推荐信息