Next.js - Parsing error: Cannot find module 'next/babel'

 

Next.js 세팅하고 css를 tailwind를 세팅하는 중에 에러가 발생했다

해결방법

 

.eslintrc.json 에서

{
  "extends": "next/core-web-vitals"
}

수정

 

자신이 babel을 사용하고 있는경우

{
  "extends": ["next/babel","next/core-web-vitals"]
}

Next.js 12버젼부터는 babel 대신 swc를 기본적으로 사용하기 때문에

{
  "extends": ["next/core-web-vitals", "prettier"]
}

뒤에 'prettier' 추가만으로 에러메시지는 사라진다.

 

 

알게된점

 

nextjs 12버전부터 babel 대신에 Rust 기반 플랫폼 SWC라는 것을 사용한다

https://nextjs.org/docs/advanced-features/compiler