1

私はsassで書かれたかなりのスタイルシートを持つRailsプロジェクトに取り組んでいます。現在のレイアウトは次のとおりです。

いくつかの他の sass ファイルを必要とするマニフェスト (application.sass) があります。

// in application.sass:
/*
 *= require reset
 *= require base
 *= require forms
 ...
 */

これらの他のスタイルシートにはすべて、いくつかの色定義を含む「部分」が含まれており、これらを広範に使用しています。

// in _colors.sass:
$foreground: '#F00'
$background: '#0F0'
// ...


// in base.sass:
@import colors.sass
#content
  background-color: $background
// ...


// in forms.sass:
@import colors.sass
form
  color: $foreground
// ...

ここで、色の定義だけを入れ替えた同じルールを含む結果のスタイルシートのコピーを生成したいと思います (たとえば、_var.sass のすべての色の定義だけを入れ替えた application.sass の正確なクローンである red_application.sass)。アウト）。

次のように、色の定義のマニフェスト ファイルへのインポートを移動しようとしました。

// in application.sass:
/*
 *= require _colors.sass
 *= require reset
 *= require base
 *= require forms
 ...
 */

// in red_application.sass:
/*
 *= require _red_colors.sass
 *= require reset
 *= require base
 *= require forms
 ...
 */

// in base.sass:
// no @import
#content
  background-color: $background
// ...


// in forms.sass:
// no @import
form
  color: $foreground
// ...

残念ながら、単一のスタイルシート (base.sass、forms.sass) は @import ステートメントなしでは生成できないため、これは機能しません。それらはその中で使用される変数を認識していないためです。

目標を達成するためにスタイルシートを再構築するにはどうすればよいですか?

4

1 に答える 1

2

スプロケットの require と scss import を混在させないでください。

sprocket が機能するには、必要な各ファイルが (コンパイル後に) 完全な css である必要があり、結果のファイルにはすべての css ファイルの内容が含まれます。

scssインポートはコンパイル段階で解決されるため、意図したとおりに実行できません。

あなたができることは、メインのscssのそれぞれに色をインポートし、スプロケットに何かを要求させないことです:

でapplication.sass:

@import _colors
@import reset
@import base
@import forms

でred_application.sass:

@import _red_colors
@import reset
@import base
@import forms
于 2012-10-31T12:13:51.173 に答える