개발자

NextJS 14 project 시작 단계에서 에러가 발생했어요... 최대한 빠른 답변 부탁드립니다.

2024년 04월 01일조회 147

npx create-next-app 라는 명령어로 프로젝트를 시작했는데요. 아무것도 건들이지 않은 상태에서 app/layout.tsx 파일을 클릭했는데 맨 위에 에러가 발생해져 있더라구요.. 내용을 보니깐 Parsing error: __classPrivateFieldGet(...).at is not a function eslint 이런 에러가 있고 해당 에러가 tailwindcss.config.ts 파일 맨 윗줄에도 발생해져 있습니다. 어떻게 해야하는 건가요..?

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.

답변 1

민경배님의 프로필 사진

일단 eslint문제로 보이네요! 체크해보셨을지는 모르겠지만 동일해보이는 이슈가 stackoverflow에 있어 링크남깁니다 - https://stackoverflow.com/questions/77678251/parsing-error-classprivatefieldget-at-is-not-a-function-error Typescript를 활용하여 프로젝트를 진행하시는 듯 해보이는데, @typescript-eslint/eslint-plugin, @typescript-eslint/parser 등 관련 의존성이 package.json에 있는지 확인해주시고, 설치를 위해 npm i 혹은 yarn 커맨드 한 번 실행해주세요!

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

AI 답변
커리어리 AI 봇 프로필 이미지

커리어리 AI 봇

GPT가 달아주는 답변입니다.

2024년 04월 01일

이 문제는 Next.js 14에서 새롭게 도입된 private class fields와 관련된 것으로 보이며, ESLint가 이를 제대로 파싱하지 못해서 발생하는 문제일 가능성이 높습니다. 현재 프로젝트에 `.eslintrc` 파일이 있는지 확인해보세요. 만약 없다면, 프로젝트 루트 디렉토리에 `.eslintrc.json` 파일을 생성하고 다음과 같은 내용을 추가해보세요: ```json { "parser": "@typescript-eslint/parser", "parserOptions": { "ecmaVersion": 2022, "sourceType": "module", "ecmaFeatures": { "jsx": true } }, "plugins": ["@typescript-eslint"], "extends": [ "eslint:recommended", "plugin:@typescript-eslint/recommended" ] } ``` 위의 설정은 TypeScript를 위한 ESLint parser와 plugin을 사용하도록 설정하는데요, `ecmaVersion` 옵션은 최신 ECMAScript 기능을 지원하도록 설정합니다. 그럼에도 불구하고 여전히 문제가 발생한다면, 사용 중인 ESLint 버전을 최신으로 업데이트 해보시기 바랍니다. npm을 사용한다면 다음 명령어를 실행하세요: ```bash npm install eslint@latest --save-dev ``` 아니면 yarn을 사용한다면 다음 명령어를 실행하세요: ```bash yarn add eslint@latest -D ``` 이것으로 문제가 해결되었으면 좋겠습니다.

목록으로

지금 가입하면 모든 질문의 답변을 볼 수 있어요!