SCSSのimport

晴れ仕事でもプライベートでも、SCSSコンパイルツールの「Koala」を使っているのだけど、ずっと疑問だったことがようやく解決された。
SCSSのインポートで

@import "common";

と書くと、「_common.scss」をインポートして、対象ファイルに展開してくれる。
設定は「自動コンパイル」になっているので、対象ファイルを保存しても、_common.scssを保存しても、都度コンパイルが行われて、出力されたファイルが最新になる。
_common.scssを保存した際には、_common.scssをインポートしているファイル全てがコンパイルされる。 というのが正しい動作で、そのように使っているのだけど、とあるタイミングで、_common.scssを保存しても、インポート元のファイルがコンパイルされない現象に、よくぶち当たっていた。
そういう場合は、面倒なのだけど、インポート元ファイルを全て保存しなおして、_common.scssの内容を反映していた。 原因がわからず、ずっと手間だったのだけど、ようやくそれが解決できた。
原因は複数ファイルインポート時の書式エラーだった。
てっきり、

@import "common", "style";

のようにすれば、_common.scss、_style.scssをインポートしてくれるものだと思い込んでいた。
が、これはSASSの記述方法で、SCSSではエラーになるらしい。 その為、1つ目のファイルのみインポート設定されている扱いになっていた。 なので、いくら_style.scssを保存し直しても、インポート元ファイルが更新されない。
正しくは、

@import "common";
@import "style";


のように、1行ずつ書かないといけなかった。 たったこれだけの違いで、手間が格段に省けるようになった。 Koalaの不具合なのか、それとも設定が悪いのか、とか、1年以上疑ってきたのだが、そもそものSCSS記述の問題だったとは盲点だった。

夜は自転車のトレーニングへ。 高松空港を巡る18.6kmコースを走った。 それほど一生懸命漕いでなかったのだけど、44分44秒と、なかなか良い記録だった。
ここ1ヶ月位、集中して自転車のトレーニングしているので、伸び具合が素晴らしい。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です