Vite React 如何安裝 Tailwind css

Tailwind 非常好用，可以說是現在前端的 CSS 框架之一，以下是 React Vite 的 Tailwind 安裝方式。

1. 首先建立 Vite 專案

在 cmd 中目標的資料夾中輸入： npx create-vite

2. 建立 React TypeScript

3. 進入專案資料夾，安裝相關程式

4. 在專案資料中安裝 tailwind

輸入以下程式碼：

npm install -D tailwindcss postcss autoprefixer

npx tailwindcss init -p

5. 設定 tailwind.confing.js

將 content 設定為：

content: [

    "./index.html",

    "./src/**/*.{js,ts,jsx,tsx}",

  ]

5. 設定 indes.css

將 index.css 設定為：

@tailwind base;

@tailwind components;

@tailwind utilities;

6. 設定完畢，記得將 app.css 中的程式碼全部刪除，以免有其他 css 作祟。