• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

tailwind css 문제인지, className 에 적용한 css가 적용되지 않아요.

24.03.19 20:44 작성 조회수 138

0

tailwind css 문제인지, className 에 적용한 css가 적용되지 않아요.

아래는 제 package.json 인데, 특정 버전으로 진행해야 하나요?

"dependencies": { "axios": "^0.26.1", "classnames": "^2.3.1", "dayjs": "^1.11.4", "env-cmd": "^10.1.0", "next": "12.1.4", "react": "18.0.0", "react-dom": "18.0.0", "react-icons": "^4.4.0", "sharp": "^0.30.7", "swr": "^1.3.0" }, "devDependencies": { "@types/node": "17.0.23", "@types/react": "17.0.43", "@types/react-dom": "17.0.14", "eslint": "8.12.0", "eslint-config-next": "12.1.4", "postcss-preset-env": "^7.4.3", "tailwindcss": "^3.0.23", "typescript": "4.6.3" }

답변 2

·

답변을 작성해보세요.

0

안녕하세요.

아 버전 차이는 아니며 index.css 에 tailwind-css를 위한 소스 코드를 안넣은 부분이 있는지
한번 체크를 해주시면 감사하겠습니다.

0

인프런 AI 인턴님의 프로필

인프런 AI 인턴

2024.03.21

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

tailwindcss가 적용되지 않는 문제는 여러 가지 원인에 의해 발생할 수 있습니다. 규남Joel님의 package.json을 보면, tailwindcss 관련 의존성은 잘 설치된 것으로 보입니다. 하지만 이 외에도 몇 가지 확인해봐야 할 점이 있습니다.

  1. Tailwind CSS 설정 파일인 tailwind.config.js가 프로젝트의 루트 디렉터리에 존재하는지 확인해주세요.
  2. 해당 파일에 purge 설정이 올바른 경로로 되어 있는지 확인해주세요. 프로젝트 안의 모든 CSS를 확인할 수 있도록 경로가 설정되어야 합니다.
  3. Tailwind CSS를 사용하기 위해서는 postcss의 설정이 필요한데, postcss.config.js 파일이 프로젝트의 루트에 있고, 올바르게 구성되어 있는지 확인해주세요.
  4. Tailwind CSS 클래스를 사용하고자 하는 스타일시트(CSS 파일)나 JSX에서 플러그인이 적용되어 있는지 확인해주세요.
  5. 만약 위의 설정들이 모두 올바르게 되어 있다면, tailwindcss 버전이 프로젝트와 호환되는지 확인하기 위해 버전을 업데이트하거나 변경해보는 것도 해결 방법이 될 수 있습니다.

다른 설정 파일들에 문제가 없는지, 혹시 다른 오류 메시지는 없는지도 함께 확인해보시기를 권장드립니다.