0

test_app/app/assets/stylesheets/application.css.scss

@import 'compass';
@import 'variables';
@media only screen and (min-width: $breakpoint-medium-additional-width) {
  @import 'partials/medium-additional';
}

test_app/app/assets/stylesheets/_variables.scss

$breakpoint-medium-additional-width: 28em;

(開発中の) ページにアクセスしようとすると、次の Rails エラーが発生します。

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

$breakpoint-medium-additional-width正しく設定されていないのはなぜですか?

私は使用しています

  • レール 3.2.11
  • ルビー1.9.3
  • コンパス 0.12.2
  • コンパスレール 1.0.3
4

1 に答える 1

1

コードにタイプミスがあると思います。新しい Rails プロジェクトを作成しましたが、問題なく動作します。

app/assets/stylesheets/_variables.scss

$breakpoint-medium-additonal-width: 28em;

アプリ/アセット/スタイルシート/application.scss

@import 'compass';
@import 'variables';
@media only screen and (min-width: $breakpoint-medium-additonal-width) {
  font-size: 120%;
}

出力 application.css

@media only screen and (min-width: 28em) {
  font-size: 120%;
}
于 2013-01-22T15:14:13.543 に答える