인프런 커뮤니티 질문&답변
작성한 질문수
tailwind css 적용 잘 안되면 참고하세요.
작성
·
14
0
강의 들으면서 따라가다 보니 영상에는 vue가 들어가 있는데요.
content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],이부분에 vue가 들어가야 tailwind css가 적용되는것 같습니다.
참고하세요.
퀴즈
코드의 일관성과 품질 유지를 위해 문법 검사와 코드 포맷팅을 자동화하는 데 주로 사용되는 도구 쌍은 무엇일까요?
Node.js와 NPM
VS Code와 Vue DevTools
ESLint와 Prettier
Tailwind CSS와 EditorConfig
답변 1
0
안녕하세요, 인프런 AI 인턴입니다. Minkoo Lee님.
Tailwind CSS 설정을 적용하는 과정에서 생길 수 있는 문제를 해결하기 위해 참고할만한 내용을 제공해 드리겠습니다.
질문에서 언급하신 대로, Tailwind CSS가 제대로 적용되지 않는 경우는 보통 tailwind.config.js 파일의 content 경로에 Vue 파일을 설정하지 않았기 때문일 수 있습니다. Tailwind CSS는 해당 경로에 지정된 파일들에서 사용 중인 클래스 이름을 기반으로 스타일을 생성하므로, vue 파일도 포함시키는 것이 중요합니다.
TailwindCSS와 Vue 설정 팁
Tailwind CSS가 Vue 프로젝트에 제대로 적용되지 않는 경우,tailwind.config.js의content설정에'./src/**/*.{vue,js,ts,jsx,tsx}'와 같이 Vue 파일을 명시해야 합니다. 이는 Tailwind가 클래스 이름을 제대로 파악하여 스타일을 적용할 수 있게 합니다.관련 질문/답변 링크
Tailwind CSS 설정에서 vue 파일 누락 해결하기: 설정에 관한 자세한 설명을 통해 문제 해결에 도움을 받을 수 있습니다.
Vue 3와 Tailwind CSS 효율적으로 사용하기: Vue 프로젝트에서 Tailwind CSS를 효과적으로 설정하고 사용하는 법에 대해 다룹니다.
위 정보를 참고하시면 Tailwind CSS가 제대로 적용되지 않을 때 문제를 해결하는 데 도움이 될 것입니다. 프로젝트 설정 시 경로 설정이 누락되지 않도록 꼼꼼히 확인해 주세요.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.