🚀

【Next.js】Parsing error: Cannot find module 'next/babel'の解決

1 min read

概要

以下の記事でNext.jsにESlint(JSのコードが正しいか検証してくれるツール)を導入した時に

Parsing error: Cannot find module 'next/babel'

が出たので解決方法を残しておきます。

https://fwywd.com/tech/next-eslint-prettier

上記エラー出力が確認できたのは以下のファイル(Tailwind CSSを導入済み)

  • next.config.js
  • tailwind.config.js
  • postcss.config.js

(他にもあるかもです)

上の画像のようにmoduleに波線が出て、ホバーすると表示されます。

解決方法

stackoverflowにしっかりがスレッドがありました。

https://stackoverflow.com/questions/68163385/parsing-error-cannot-find-module-next-babel

作業としては.eslintrcに以下のように追記するだけです。

.eslintrc
// extendsに'next/babel'を追記する
{
  "extends": ["next", "next/core-web-vitals", "prettier", "next/babel"]
}

これでOKです。波線が消えます。

Discussion

ログインするとコメントできます