タイトルにあるように、変数がSASSで定義されているかどうかを確認しようとしています。 (それが異なる違いを生む場合、私はコンパスを使用しています)
Rubyと同等のものが見つかりました:
defined? foo
暗闇の中でショットを与えたが、それはちょうど私にエラーを与えました:
defined": expected "{", was "?
私は回避策を見つけました(これは明らかにすべての場合に変数を定義するだけであり、この場合は実際にはより理にかなっています)が、これが将来可能かどうかを本当に知りたいです
Sass 3.3現在、variable-exists()
関数があります。 変更ログ から:
- これらの新しい関数を使用して、さまざまなSassコンストラクトの存在を判別できるようになりました。
variable-exists($name)
は、変数が現在のスコープで解決するかどうかを確認します。global-variable-exists($name)
は、指定された名前のグローバル変数が存在するかどうかを確認します。 ...
使用例:
_$some_variable: 5;
@if variable-exists(some_variable) {
/* I get output to the CSS file */
}
@if variable-exists(nonexistent_variable) {
/* But I don't */
}
_
今日、私は同じ問題に出くわしました。変数が設定されているかどうかを確認しようとして、そうであればスタイルを追加したり、ミックスインを使用したりするなどです。
isset()
関数 sassに追加されない を読んだ後、 _!default
_ キーワードを使用して簡単な回避策を見つけました。
_@mixin my_mixin() {
// Set the variable to false only if it's not already set.
$base-color: false !default;
// Check the guaranteed-existing variable. If it didn't exist
// before calling this mixin/function/whatever, this will
// return false.
@if $base-color {
color: $base-color;
}
}
_
false
が変数の有効な値である場合、次を使用できます。
_@mixin my_mixin() {
$base-color: null !default;
@if $base-color != null {
color: $base-color;
}
}
_
補足的な答えとして-特定のユースケースではdefault
キーワードを確認する必要があります。変数がまだ定義されていない場合、変数にデフォルト値を割り当てることができます。
値の最後に!defaultフラグを追加して、変数がまだ割り当てられていない場合は、変数に割り当てることができます。これは、変数が既に割り当てられている場合、再割り当てされないことを意味しますが、値がまだない場合は、値が与えられます。
例:
Specific-variables.scssには次のものがあります。
$brand: "My Awesome Brand";
Default-variables.scssには次のものがあります。
$brand: company-name !default;
$brand-color: #0074BE !default;
プロジェクトは次のように構築されます。
@import "specific-variables.scss"; @import "default-variables.scss"; @import "style.scss";
ブランドの値はMy Awesome Brandになり、ブランドカラーの値は#0074BEになります。