프로그래밍/react

Vite에서 TailWindCss 설치하기

GOHA 2025. 8. 20. 10:24
  1. Vite 프로젝트 초기화
    npm create vite@latest my_project
    cd my_project

  2. tailwindcss 설치
    npm install -D tailwindcss postcss autoprefixer
    npx tailwindcss init -p

  3. tialwindcss 설정 파일 변경
    => tailwind.config.js
    module.exports = {
    content: ["./index.html", "./src/*/.{js,ts,jsx,tsx}"],
    theme: {

     extend: {},

    },
    plugins: [],
    }

  4. src/index.css tailwind 지시어 추가
    @tailwindcss base;
    @tailwindcss components;
    @tailwindcss utilites;