Question

application.css.scss

@import 'compass';
$var: 28em;
@media only screen and (min-width: $var) {
  font-size: 120%;
}

当我尝试访问某个页面（正在开发中）时，会发生此Rails错误：

Sass::SyntaxError at /today
Invalid CSS after "...nd (min-width: ": expected expression (e.g. 1px, bold), was "$var) {" (in /Users/ben/rails_projects/test_app/app/assets/stylesheets/application.css.scss)

如果我将 application.css.scss 更改为直接使用28em而不是$var，那么它可以正常工作：

@import 'compass';
$var: 28em;
@media only screen and (min-width: 28em) {
  font-size: 120%;
}

为什么我无法使用$var？

我正在使用

Rails 3.2.11
ruby 1.9.3
指南针0.12.2
compass-rails 1.0.3
sass 3.1.12
sass-rails 3.2.3

的Gemfile

group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'uglifier', '>= 1.0.3'
  gem 'compass-rails'
end

Answer 1

我建议你不要在清单文件application.css前加上前缀。如果要添加样式，请在其中一个css.scss目录中创建一个新的assets文件，并将其在清单文件中要求。 This guide有一些处理资产管道的宝贵规则。

当我尝试使用Compass变量时导致此错误的原因是什么？

1 个答案: