使用 compass-watch 将单个 Scss 文件转换为 CSS
Convert a single Scss file to CSS using compass-watch
我厌倦了手动将 Scss 模块一一转换为 CSS。我只想从许多模块转换我的个人 Scss 文件。我在 compass 的 rails 服务上通过 ruby 在基于命令行的编译 CSS 上使用 compass watch .
在这里您可以看到我如何通过 ror cli.
管理 Scss 到 CSS 的转换
您可以创建一个 scss 或 sass 文件，您将在其中导入所有部分。
示例：在您的 sass 目录中创建一个 sass 文件并根据需要命名，例如 app.sass.
在 app.sass 中，像这样导入所有部分：@import 'partials/button-actions'
在启动 watcher 的目录中创建 config.rb。我更喜欢使用项目根目录。
在 config.rb 内插入：
require 'compass/import-once/activate'
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
# Change paths to yours. css_dir is css output directory, sass_dir is your sass file directory
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "i"
javascripts_dir = "js"
# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed
output_style = :compressed
# To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true
# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
并启动观察器。结果，您将获得一个 app.css 文件，其中包含导入文件中的所有代码。将其导入您的 HTML.
我厌倦了手动将 Scss 模块一一转换为 CSS。我只想从许多模块转换我的个人 Scss 文件。我在 compass 的 rails 服务上通过 ruby 在基于命令行的编译 CSS 上使用 compass watch .
在这里您可以看到我如何通过 ror cli.
您可以创建一个 scss 或 sass 文件，您将在其中导入所有部分。
示例：在您的 sass 目录中创建一个 sass 文件并根据需要命名，例如 app.sass.
在 app.sass 中，像这样导入所有部分：@import 'partials/button-actions'
在启动 watcher 的目录中创建 config.rb。我更喜欢使用项目根目录。
在 config.rb 内插入：
require 'compass/import-once/activate'
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
# Change paths to yours. css_dir is css output directory, sass_dir is your sass file directory
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "i"
javascripts_dir = "js"
# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed
output_style = :compressed
# To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true
# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
并启动观察器。结果，您将获得一个 app.css 文件，其中包含导入文件中的所有代码。将其导入您的 HTML.