3
3

More than 5 years have passed since last update.

Zurb Foundation 5が最近のsassで使えない問題への回避策

Last updated at Posted at 2014-09-02

[2014/9/6追記]
対応がマージされました。 https://github.com/zurb/foundation/pull/5708


foundation-rails 5.4.3がsass-3.4.2で使えない問題への回避策。

結論

非常に筋が悪いが、回避策としては app/assets/stylesheets/foundation_and_overrides.scssにsass標準のindex関数の代わりを定義する。

@function index($list, $value) {
   $i: 1;
   @each $e in $list {
      @if ($e == $value) {
        @return $i; 
      }
      $i: $i + 1;
   }
   @return false;
}

早く直らないかな...
https://github.com/zurb/foundation/pull/5708

詳細

Zurb Foundation は、中でコンポーネントの重複出力を防ぐため、sass-import-onceという仕掛け(イディオム)を使っている。
"@include exports" what is it for?

このsass-import-onceは、読み込んだモジュールの一覧を維持し、その一覧にあるかどうかで処理するかどうかを決めるという単純なもの。コードは以下の通り。

$modules: () !default;
@mixin exports($name) {
  @if (index($modules, $name) == false) {
    $modules: append($modules, $name);
    @content;
  }
}

しかし、ここで利用しているindex関数が、項目が存在しない場合は昔はfalseを返していたが、nullを返すように変更されてしまっているため、上記のコードではif文が通らなくなり、各種コンポーネントのスタイルが出力されなくなってしまっている...
Deprecate index()'s false return value

上述の@if (index(...) == false) を @if (not index(...)) とすれば良いのだが、gem側を書き換えるといろいろ残念なので、
rails g foundation:installで作成され、こちらで管理しているfoundation_and_overrides.scssに過去と同一の挙動をする
index関数を用意した。

各種コードがきちんと@if (not ...で判定していれば問題ないはず...

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
3