gulp-sassのマイナーバージョンが上がったらsassファイルがコンパイルできなくなった

3 4月

プロジェクトのメンバーから、gulpタスクで行なっているsassのコンパイルができなくなったとの相談を受けた。

起きていたエラーは以下。

Error: Mixins may not be defined within control directives or other mixins.

SassのControl Directives(@if、@each、@for、@while)や他のmixinの中ではmixinが定義できない、ということらしい。プロジェクトのコード内で、@ifの中で@mixinの定義をしている部分でエラーになっていた。

調べたところ、package.jsonで指定している gulp-sass のバージョンが 3.1.0 から 3.2.1 に上がっていた。

gulp-sassのバージョンを 3.2.0 にするとエラーが起きなくなるので、3.2.0 から 3.2.1 の間に問題があるらしい。

gulp-sass@3.2.1の変更点を見ると、依存するnode-sassのバージョンが4.8.3に変更されている。(gulp-sass@3.2.0は4.8.1)

 

これをやったら解決できた

package.jsonの中で指定されているgulp-sassのバージョンを、マイナーバージョンまで含めて固定した。

$ npm i gulp-sass@3.2.0 --save-exact

プロジェクトによってはこれでうまくいかない場合があったので、node-sassのバージョンも固定した。

$npm i node-sass@4.8.1 --save-exact

 

それでもうまくいかない場合は、package-lock.json(ファイル)やnode_modules(フォルダ)を削除してもらって、再度 npm i を実行してもらって、コンパイルができるようになった。

コメントを残す

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