Refactor code structure for improved readability and maintainability

AGENTS.md

@@ -8,7 +8,7 @@ YGChatCS 是一个基于 uni-app + Vue 3 的多端应用，当前配置重点面
 
 ## 技术栈
 
-- 框架：uni-app 3、Vue 3、Vite 5。
+- 框架：uni-app 3、Vue 3、Vite 5、Tailwindcss。
 - 状态管理：Pinia 3，使用 `pinia-plugin-unistorage` 做持久化。
 - 样式：SCSS，公共工具类在 `src/static/scss/`，全局变量在 `src/uni.scss`。
 - 多端：保留 H5、App、各类小程序脚本；当前微信小程序配置最完整。
@@ -22,8 +22,6 @@ YGChatCS 是一个基于 uni-app + Vue 3 的多端应用，当前配置重点面
 yarn install
 yarn dev:mp-weixin
 yarn build:mp-weixin
-yarn dev:h5
-yarn build:h5
 yarn switch-client zhinian
 ```
 

package.json

@@ -2,6 +2,7 @@
   "name": "YGChatCS",
   "version": "1.0.0",
   "scripts": {
+    "postinstall": "node ./node_modules/weapp-tailwindcss/bin/weapp-tailwindcss.js patch",
     "dev:app": "uni -p app",
     "dev:app-android": "uni -p app-android",
     "dev:app-ios": "uni -p app-ios",
@@ -70,10 +71,13 @@
     "@dcloudio/uni-cli-shared": "3.0.0-4070620250821001",
     "@dcloudio/uni-stacktracey": "3.0.0-4070620250821001",
     "@dcloudio/vite-plugin-uni": "3.0.0-4070620250821001",
+    "@tailwindcss/postcss": "^4.3.0",
     "@vue/runtime-core": "^3.4.21",
     "@vue/tsconfig": "^0.1.3",
     "sass": "1.58.3",
-    "vite": "5.2.8"
+    "tailwindcss": "^4.3.0",
+    "vite": "5.2.8",
+    "weapp-tailwindcss": "^4.12.0"
   },
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }

src/app.css

@@ -0,0 +1,7 @@
+@import "weapp-tailwindcss/index.css";
+
+@source "./**/*.{vue,js,ts}";
+@source not "./uni_modules";
+@source not "../dist";
+@source not "../node_modules";
+@source not "../docs";

src/main.js

@@ -1,4 +1,5 @@
 import App from "./App";
+import "./app.css";
 import share from "./utils/share";
 
 // #ifndef VUE3
@@ -32,4 +33,4 @@ export function createApp() {
     pinia,
   };
 }
-// #endif
+// #endif

src/pages/test/index.vue

@@ -1,8 +1,8 @@
 <template>
   <scroll-view class="test-page h-screen bg-F5F7FA" scroll-y>
     <view class="test-page__header">
-      <view class="test-page__title">ChatModule 视觉组件预览</view>
-      <view class="test-page__subtitle">组件使用 props mock 数据渲染，点击事件仅打印日志。</view>
+      <view class="text-[20px] text-red-500 font-bold">ChatModule 视觉组件预览</view>
+    <view class="mt-2 text-[#64748b] font-bold text-[12px] leading-5">组件使用 props mock 数据渲染，点击事件仅打印日志。</view>
     </view>
 
     <view class="test-page__section">

vite.config.js

@@ -2,6 +2,8 @@ import { defineConfig } from "vite";
 import path from "path";
 import uni from "@dcloudio/vite-plugin-uni";
 import md5 from "md5-hash";
+import tailwindcss from "@tailwindcss/postcss";
+import { UnifiedViteWeappTailwindcssPlugin } from "weapp-tailwindcss/vite";
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -11,6 +13,9 @@ export default defineConfig({
     },
   },
   css: {
+    postcss: {
+      plugins: [tailwindcss()],
+    },
     preprocessorOptions: {
       scss: {
         api: "modern-compiler",
@@ -18,7 +23,13 @@ export default defineConfig({
       },
     },
   },
-  plugins: [uni()],
+  plugins: [
+    uni(),
+    UnifiedViteWeappTailwindcssPlugin({
+      rem2rpx: true,
+      cssEntries: [path.resolve(__dirname, "./src/app.css")],
+    }),
+  ],
   build: {
     commonjsOptions: {
       transformMixedEsModules: true,