node-sassを導入しようと思ったらエラーを吐いて困った話

2020-02-29
プログラミング

はじめに

こんにちは。
ionic (React & TypeScript) でアプリ開発の環境を作っていた際に、
node-sass がエラーを吐いて困ったので解決方法を備忘録として残します。

バージョンについて

Node: v12.16.1
node-sass: ^4.13.1

Error内容について

Error: Missing binding /project_root/node_modules/node-sass/vendor/darwin-x64-72/binding.node
Node Sass could not find a binding for your current environment: OS X 64-bit with Node.js 12.x

Found bindings for the following environments:
  - Unknown environment (.DS_Store)
  - OS X 64-bit with Node.js 11.x

This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass` to download the binding for your current environment.

Node のバージョンとの相性かーと思い、指示通り npm rebuild node-sass を実行。
がしかし、エラーが解消されなかったので npm rebuild node-sass —force も試してみました。
でもだめ。。。
ググってみても、みなさん rebuild で解決している模様。。。

結局これで解決!

いろいろ調べてみると、下記のブログに辿り着きました。

Node Sass could not find a binding for your current environmentというエラーメッセージをきっかけに…
dev.classmethod.jp

ここまでコードを読み込んだことがなかったのでとても勉強になりました。
なるほどなるほどと思い、とりあえず github から自分の環境に適した Assets をダウンロード。
(今回の場合だと darwin-x64-72 です)

https://github.com/sass/node-sass/releases

ダウンロードしたファイルを
/project_root/node_modules/node-sass/vendor
に追加しました。これにて無事解決です!!

本来であれば rebuild することで自動的に適した Assets が追加されるはずなんですが・・・
根本的な解決にはなっていないかもしれませんが、これで開発が進みそうです。