Node.js v21 で Sass がエラーになってしまう場合

2023/10/21

この記事は最終更新日から 1年以上が経過しています。

最近、Node.js の最新版がバージョン 21.0.0 にアップデートされましたが、それと最新版の Sass を組み合わせると、Sass でエラーが発生してしまうようです。最近アップデートされたばかりということもあり、調べても情報が少なかったので誰かのために軽くまとめておきます。

環境とエラーの内容

環境

今後のバージョンアップで修正されるかもしれませんので、バージョン番号を記載しておきます。

Node.js	21.0.0
Sass	1.69.3 1.69.4 ※ ちゃんと調べてません。

2023/10/29 追記：
Sass 1.69.5 で Node.js v21 に対応されたので、Sass 1.69.5 以降では発生しません。

エラーの内容

内容はこちら。エラーメッセージ的には ua.indexOf() が見つからないということみたいですが、ざっと調べたところによると原因は、変数 ua の中身である navigator.userAgent が取得できず、 ua が undefined になってしまっているということのようです。

エラー内容

C:\Users\Test\demo\node_modules\sass\sass.dart.js:116832
    if (ua.indexOf("DumpRenderTree") >= 0) return hooks;
           ^

TypeError: Cannot read properties of undefined (reading 'indexOf')
    at C:\Users\Test\demo\node_modules\sass\sass.dart.js:116832:12
    at Object.applyHooksTransformer (C:\Users\Test\demo\node_modules\sass\sass.dart.js:1863:14)
    at Object.initHooks (C:\Users\Test\demo\node_modules\sass\sass.dart.js:1843:251)
    at Object.initNativeDispatchContinue (C:\Users\Test\demo\node_modules\sass\sass.dart.js:1809:9)
    at Object.initNativeDispatch (C:\Users\Test\demo\node_modules\sass\sass.dart.js:1803:9)
    at Object.getNativeInterceptor (C:\Users\Test\demo\node_modules\sass\sass.dart.js:29308:13)
    at Object.getInterceptor$x (C:\Users\Test\demo\node_modules\sass\sass.dart.js:29569:16)
    at Object.set$compile$x (C:\Users\Test\demo\node_modules\sass\sass.dart.js:29636:16)
    at Object.main (C:\Users\Test\demo\node_modules\sass\sass.dart.js:24401:9)
    at main2 (C:\Users\Test\demo\node_modules\sass\sass.dart.js:26210:9)

Node.js v21.0.0

対策

現状では、Node.js を 20.8.1 にダウングレードするしかなさそうです。 Sass の GitHub 上では対応が議論されているようなので、 Node.js か Sass のどちらかで対応されるまで待ちましょう。

2023/10/29 追記：
Sass 1.69.5 で Node.js v21 に対応されたので、Sass 1.69.5 以降にバージョンアップすると動くようになります。

Node.js v21 で Sass がエラーになってしまう場合

環境とエラーの内容

環境

エラーの内容

対策

参考サイト

関連記事

Sass のソースマップの使い方

Sass の使い方（その１：概要）

Node.js と npm の使い方（その１：概要）

記事検索

最新記事

人気記事

RSSフィード

フィードバック