chore: Tailwind CSS 3.4 迁移到 4.x(CSS-first 配置 + @tailwindcss/vite)

- 升级 tailwindcss@4.3 + @tailwindcss/vite,移除 postcss/autoprefixer/tailwindcss-animate
- tailwindcss-animate 替换为 tw-animate-css(v4 兼容的 animate-in/out 工具类)
- global.css 改用 @import "tailwindcss" + @theme inline 映射 shadcn 设计令牌
- @custom-variant dark 替代 darkMode:'class';@source 显式纳入 pages/ 目录
- 删除 tailwind.config.ts / postcss.config.js,components.json 同步 v4 约定
- vite.config.ts 接入 tailwindcss 插件,__dirname 改 import.meta.dirname
This commit is contained in:
2026-09-09 02:54:56 +08:00
parent 230006a905
commit 3702e3d1f2
7 changed files with 632 additions and 786 deletions

View File

@@ -1,17 +1,18 @@
import path from 'path';
import path from 'node:path';
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import vike from 'vike/plugin';
import tailwindcss from '@tailwindcss/vite';
// 与 Go 后端默认端口一致,可通过 VITE_API_PORT 覆盖
const apiPort = process.env.VITE_API_PORT || '3000';
const apiTarget = `http://localhost:${apiPort}`;
export default defineConfig({
plugins: [react(), vike()],
plugins: [react(), vike(), tailwindcss()],
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
'@': path.resolve(import.meta.dirname, './src'),
},
},
base: '/',