Cannot find module 에러

손에 익는 Next.js - 마이그레이션하기

엔트리포인트 페이지 만들기

해결된 질문

작성

497

vite 로 작성한 경우를 마이그레이션 하는데요.

강의에 따라서 진행하였는데 최종 아래처럼 에러가 발생합니다.

Require stack:

\node_modules\next\dist\server\dev\next-dev-server.js

vite\node_modules\next\dist\server\dev\next-dev-server.js

vite\node_modules\next\dist\server\next.js

vite\node_modules\next\dist\server\lib\start-server.js

package.json 은 아래와 같아요.

{
  "name": "next-migration-02-vite",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "lint": "next lint",
    "start": "next start"
  },
  "dependencies": {
    "next": "^14.1.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@types/node": "20.11.24",
    "@types/react": "^18.2.56",
    "@types/react-dom": "^18.2.19",
    "@typescript-eslint/eslint-plugin": "^7.0.2",
    "@typescript-eslint/parser": "^7.0.2",
    "@vitejs/plugin-react": "^4.2.1",
    "eslint": "^8.56.0",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.5",
    "typescript": "^5.2.2",
    "vite": "^5.1.4"
  }
}

관련해서 안내좀 부탁드립니다.

좋은 주말 되세요~

react next.js vitejs

답변 2

하조은

지식공유자

억수님, 안녕하세요! 질문 확인이 늦었습니다.

혹시 해당 에러를 마주한 상황에 어떤 명령어를 입력하셨는지 확인해주실 수 있을까요?
답변 남겨주시면 이번에는 빠르게 도움 드릴 수 있도록 하겠습니다.

감사합니다.

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다.

Next.js 마이그레이션 과정에서의 문제 해결을 위해 말씀해 주신 내용을 바탕으로 몇 가지 확인해 볼 사항을 안내드립니다.

우선, Next.js와 Vite는 서로 다른 번들러를 사용하기 때문에 next 명령어로 실행하거나 빌드할 때 Vite 관련 의존성이나 설정이 포함되어 있지는 않은지 확인해 보세요.
package.json에 “type”: “module”이 설정되어 있는 경우에는 import와 export 문법을 사용하도록 되어 있습니다. 만약 CommonJS 모듈 시스템을 사용하는 경우(require, module.exports 등), 이 설정을 제거하거나 관련 구문을 ESM 방식으로 변경해야 합니다.
next 폴더 내부의 모듈을 직접 require 하고 있지 않은지 확인해 보세요. 일반적으로 사용자 코드에서 내부 모듈을 직접 require 하는 경우는 드뭅니다.
Next.js의 버전이 최신 버전과 호환되는지, 모든 의존성이 적절한 버전을 가지고 있는지 확인해 보세요. 필요한 경우, npm install 또는 npm update로 최신 패키지를 설치하거나 업데이트할 수 있습니다.

문제가 지속될 경우 Next.js 프로젝트 폴더에서 node_modules 폴더와 package-lock.json 파일을 제거한 후 재설치를 진행해 보시는 것도 좋은 방법입니다.

rm -rf node_modules
rm package-lock.json
npm install

또한, Vite 관련 설정을 제거하거나 번들러 설정이 Next.js와 충돌하지 않도록 구성했는지 확인하십시오.

에러와 관련된 부분을 더 자세히 알기 어렵기 때문에, 추가적으로 로그나 화면 캡쳐를 제공해주시면 더 정확한 도움을 드릴 수 있을 것 같습니다.

도움이 되셨길 바라며, 문제 해결 후 즐거운 주말 보내시기 바랍니다!

인프런 커뮤니티 질문&답변

Cannot find module 에러