メインコンテンツに移動

Drupalでsassを使っている場合は注意!

こんにちは、ぴころじーの竹川です。

私を含め、Drupalを利用している方には、sassを使用している方も多くいらっしゃるのではないでしょうか。分かっている方もいらっしゃると思いますが、私自身に対する注意喚起という意味を含め、残しておこうと思います。

前提として、DrupalのsassコンパイラーモジュールSCSS/Less Compilerを利用している場合です。

SCSS/Less Compiler

2024年3月執筆時点で、sass公式では@importはサポート終了(正式に終了したのは2022年10月)となっています。しかし、上記モジュールのSassコンパイラはPHP Sassを利用しており、主流のDart Sassの記法に準拠しておらず、@useの構文を使用することができません。依然として、@importのままとなっています。

もし、Drupalを使用した新規開発でSassを使用する場合、Dart Sassを利用するか、PHP Sassを利用するか、判断をする必要があります。なぜなら、構文はもちろんのこと、開発環境までも左右されてしまうからです。

現時点、DrupalではDart Sassの記法で記述したscssファイルを扱うことができないため、一度ローカルでcssファイルにコンパイルしてからテーマのlibraries.ymlファイルに記述する必要があります。PHP Sassの記法で記述し、SCSS/Less Compilerを利用すれば、直接scssファイルをテーマのlibraries.ymlファイルに記述することができるので、ここに手間がかかるようになります。

これらの開発コストを考慮し、どちらにすべきかを考えた末、studio picoでは、PHP SassからDart Sassに乗り換えを行いました。

@importから@useに変更すると、そこだけではなく、ソースコードのアチラコチラに変更点が出てきます。既存の改修などで、PHP SassからDart Sassへの変更は極めて慎重にならないければいけません。

ですが、新規開発でしたら、チャレンジしてみるのもありではないでしょうか。