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

bibipapa님의 프로필 이미지

작성한 질문수

[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)

Next.js 15에서 Material Tailwind 설정

해결된 질문

24.10.26 22:10 작성

·

116

·

수정됨

0

# Material Tailwind 와 연관된 라이브러리 설치

 

npm install @emotion/react @emotion/styled @material-tailwind/react @mui/icons-material --save
npm install @tailwindcss/typography autoprefixer --save-dev

 

지난주 공개된 next.js 15에서 Material Tailwind 설정하려니 안되서 도움 부탁드립니다.

아직 초보라 이런 부분들이 개인적으로 좀 어렵네요~~^^;

답변 2

0

로펀님의 프로필 이미지
로펀
지식공유자

2024. 10. 28. 13:40

안녕하세요~ 슬랙 채널로 Github Repository Link와 함께 문의주시면 디버깅 같이 진행해드리겠습니다.

감사합니다.

0

인프런 AI 인턴님의 프로필 이미지

2024. 10. 26. 22:16

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

Next.js 15에서 Material Tailwind 설정 관련 질문을 주셨군요. 최신 버전의 Next.js에서 Material Tailwind를 설정하는 과정에서 문제가 발생할 수 있는 주된 원인은 패키지 호환성이나 Tailwind의 설정 파일일 수 있습니다. 다음은 문제 해결에 도움이 될 수 있는 몇 가지 팁입니다.

  1. Tailwind CSS 설정:

    • tailwind.config.js 파일이 올바르게 설정되어 있는지 확인하세요. plugins 항목에 @tailwindcss/typography가 포함되어야 합니다.
  2. Next.js와 Tailwind CSS의 호환성:

    • 최신 버전의 Next.js와 Tailwind CSS가 호환되는지 확인하세요. 두 라이브러리는 종종 업데이트되며, 새 버전이 이전 버전과 충돌할 수 있습니다.
  3. 패키지 설치:

    • node_modules 폴더를 삭제한 후, npm install 명령어를 사용해 패키지를 다시 설치해보세요. 이 과정을 통해 패키지 설치 중 발생할 수 있는 오류를 해결할 수 있습니다.

아래 링크는 이전에 비슷한 문제에 대해 논의된 게시물입니다. 여기서 다른 사용자들이 어떤 해결책을 제시했는지 참고할 수 있습니다:

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

bibipapa님의 프로필 이미지

작성한 질문수

질문하기