Tailwind CSS 安裝 專案相關套件

prettier-plugin-tailwindcss

1. 通常一起安裝三個工具庫：prettier、prettier-plugin-tailwindcss和 vite-plugin-svgr

   npm install -D prettier prettier-plugin-tailwindcss vite-plugin-svgr

2. ✨要自己手動建立 .prettierrc 文件：

    {
      "plugins": ["prettier-plugin-tailwindcss"]✨✨✨✨✨
    }
   

3. 處理 SVG 的顯示，在 vite.config.js 中新增一些設定

    //vite.config.js
    import { defineConfig } from 'vite'
    import react from '@vitejs/plugin-react'
    import svgr from "vite-plugin-svgr"✨新增
   
    // https://vite.dev/config/
    export default defineConfig({
    plugins: [react(), svgr()],✨新增
    })
   

• prettier-plugin-tailwindcss 正確安裝，則className 類別應會自動排序。
• prettier 作用: 稍微調亂程式碼，儲存檔案時，所有內容應該都會被正確格式化。