모달 관련 질문
안녕하세요!
페럴렐 & 인터셉팅 라우트 강의에서 @modal 폴더 안에 (.)book/[id] 폴더를 넣고 나니 빈 화면에
에러가 떠서 콘솔을 확인해봤습니다
에러를 확인해보니 트리구조가 깨졌다라고 해서 제가 잘못 작성한게 있나 싶어서 하나하나 다시 코드 작성을 해보았는데도 어느 부분이 에러가 나는 건지 알 수가 없어서 이렇게 질문을 올립니다 ㅠㅠ
현재 폴더 구조입니다
글로벌 레이아웃 파일입니다
@modal에 넣기 전에는 에러 없이 모달 창이 잘 열리는데 슬롯 안에 넣고 나니 에러가 뜨네요 ㅠㅠ
혹시 몰라서 강사님께서 깃허브에 올려주신 코드로 바꿔봤는데도 계속 같은 에러가 뜨네요..
답변 3
0
.next 폴더 지웠다가 다시 npm run dev 실행하니까 에러 고쳐졌습니다...! 강사님께서 분명 알려주신 내용인데 그냥 터미널 종료하고 npm run dev만 했었네요.. 혹시나 같은 실수 하시는 분 있으실까봐 글은 남겨 놓겠습니다..!
0
안녕하세요, 인프런 AI 인턴입니다. 현석님.
친절하게 에러 내용을 공유해 주셔서 감사를 드립니다. 설명하신 에러는 특히 클라이언트 라우팅과 관련된 문제입니다. 트리 구조가 깨졌다는 메시지는 주로 라우팅 구조가 예상치 못한 방식으로 변경되었음을 의미합니다. 시작점으로 몇 가지 사항을 점검해보세요:
1. 경로 및 폴더 구조 확인
- 폴더 구조: @modal 폴더와 (.)book/[id] 폴더의 존재 여부와 그 위치가 올바르게 설정되어 있는지 확인하세요. 해당 디렉터리 구조가 잘못되어 모듈이 불러와지지 않는 경우가 종종 있습니다.
- 폴더 이름: 점(.)의 사용이 특수한 의미를 가질 수 있으니, Next.js의 폴더 구조에 적합한지 확인해 보시기 바랍니다.
2. 라우팅 설정 확인
- 라우팅 오류: configureRouting, route resolution과 관련된 설정 확인이 필요합니다. Next.js에서 제공하는
Link컴포넌트를 사용하면서 다이내믹 라우팅을 올바르게 설정했는지 확인하세요.
3. 코드 디버깅
- 콘솔 로그:
initialTree가 설정되는 부분에 로그를 삽입해 제대로 된 데이터를 사용하고 있는지 확인해 보세요. 이로 인해 문제의 원인을 찾는 데 도움이 될 수 있습니다.
- 모듈 의존성: 동일한 모듈이나 컴포넌트를 가져오는 부분에서 중복된 의존성이나 잘못된 import 문이 있는지 확인하세요.
유사 문제와 해결 링크 및 안내
- 해당 오류와 관련하여 Next.js 공식 문서 및 다음과 같은 유사 케이스를 참고해 보세요:
위의 제안들이 문제 해결에 도움이 되길 바랍니다. 추가로 코드를 직접 확인할 수 있다면 더욱 맞춤형 지원을 제공할 수 있습니다. 궁금한 점이 있으시거나 더 많은 지원이 필요하다면 이어서 질문해 주세요.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
렌더링 관련 질문
0
73
2
중복으로 하나의 api를 요청할 때 캐싱 옵션 통일화
0
56
2
라우트 세그먼트 옵션 강좌 노트에 사소한 제보 남깁니다.
0
57
2
SSR시 context에 params말고 query를 사용하면 안되나요?
0
68
2
npx prisma db push 시 에러가 뜹니다.
0
89
3
vercel 배포를 실패하였습니다.
0
90
3
Image 컴포넌트 사용시 브라우저 콘솔에 경고는 왜 뜨는걸까요?
0
53
2
getServerSideProps 함수와 SSR의 관계
0
73
6
없는 페이지인데 풀라우트캐시로 저장이 되는 이유가 궁금합니다
0
55
2
실제 프로젝트에서 SSR 사용에 관해서 질문드립니다.
0
111
2
일반적인 nextjs project architecture에 대하여..
0
83
2
2.14 Search에서 작성한건 static이긴하지만 CSR이 아닌가요?
0
70
2
배포 시 오류 발생
0
83
2
백엔드 서버 오류납니다.
0
79
2
취약점 제거시 nestjs 버전 문제가 생길까요?
0
89
1
eslint.config.mjs 내 rules 어떻게 설정 하나요?
0
101
1
[book]/[id]/page.tsx 모달 띄울 때 성능 하락 현상은 ReviewList를 불러오면서 발생하는 문제 같습니다.
0
60
2
빨간줄 설정
0
74
2
익스텐션 질문
0
58
1
강의 들으면서 궁금한 부분 질문드립니다.
0
108
1
서버 배포 에러입니다.
1
96
2
[5.2) 풀라우트 캐시 2] fetch의 cache 옵션 기본값 질문: no-store/force-cache
1
102
2
백엔드 prisma 연결
0
92
2
SSR과 CSR fetch 섞어서 써도 되나요?
0
86
2