vite-react에 tailwind css 적용시키기

마조리카·2023년 5월 14일
0
npm install -D tailwindcss postcss autoprefixer

Tailwind CSS 프레임워크
Vanilla CSS의 접두사와 같은 다양한 기능을 수행하는 플러그인을 제공하는 Post CSS
Autoprefixer는 CSS를 구문 분석하고 CSS 규칙에 공급업체 접두사를 추가하는 PostCSS 플러그인입니다.

src/index.css 생성
@tailwind base;
@tailwind components;
@tailwind utilities;

main.tsx에 import 하기

npx tailwindcss init -p
module.exports = {
  content: ["./src//*.{js,jsx,ts,tsx}",["./index.html"],
}
postcss.config.js 생성
module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  }
}

0개의 댓글