feat(projects): add the plugin: vite-plugin-vue-transition-root-validator, to optimize the development experience.

build/plugins/index.ts

@@ -2,6 +2,7 @@ import type { PluginOption } from 'vite';
 import vue from '@vitejs/plugin-vue';
 import vueJsx from '@vitejs/plugin-vue-jsx';
 import progress from 'vite-plugin-progress';
+import vueRootValidator from 'vite-plugin-vue-transition-root-validator';
 import { setupElegantRouter } from './router';
 import { setupUnocss } from './unocss';
 import { setupUnplugin } from './unplugin';
@@ -17,7 +18,8 @@ export function setupVitePlugins(viteEnv: Env.ImportMeta, buildTime: string) {
     setupUnocss(viteEnv),
     ...setupUnplugin(viteEnv),
     progress(),
-    setupHtmlPlugin(buildTime)
+    setupHtmlPlugin(buildTime),
+    vueRootValidator()
   ];
 
   return plugins;

package.json

@@ -99,6 +99,7 @@
     "vite-plugin-progress": "0.0.7",
     "vite-plugin-svg-icons": "2.0.1",
     "vite-plugin-vue-devtools": "8.0.5",
+    "vite-plugin-vue-transition-root-validator": "^0.0.4",
     "vue-eslint-parser": "10.2.0",
     "vue-tsc": "3.2.1"
   },

pnpm-lock.yaml

@@ -159,6 +159,9 @@ importers:
       vite-plugin-vue-devtools:
         specifier: 8.0.5
         version: 8.0.5(vite@7.3.0(@types/node@25.0.3)(jiti@2.6.1)(sass@1.97.1)(tsx@4.21.0)(yaml@2.8.2))(vue@3.5.26(typescript@5.9.3))
+      vite-plugin-vue-transition-root-validator:
+        specifier: ^0.0.4
+        version: 0.0.4(vite@7.3.0(@types/node@25.0.3)(jiti@2.6.1)(sass@1.97.1)(tsx@4.21.0)(yaml@2.8.2))(vue@3.5.26(typescript@5.9.3))
       vue-eslint-parser:
         specifier: 10.2.0
         version: 10.2.0(eslint@9.39.2(jiti@2.6.1))
@@ -3871,6 +3874,12 @@ packages:
     peerDependencies:
       vite: ^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0 || ^6.0.0-0 || ^7.0.0-0
 
+  vite-plugin-vue-transition-root-validator@0.0.4:
+    resolution: {integrity: sha512-7bJxNn2/v3heN+zSsaoSrSp9RdV6gCe/9N0s4bk+5mGqDnXlTeyuK0fF/KXGhUBWy59yj+QnX3rCD8viX2RDgw==}
+    peerDependencies:
+      vite: '>=4.0.0'
+      vue: '>=3.0.0'
+
   vite@7.3.0:
     resolution: {integrity: sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -7941,6 +7950,11 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  vite-plugin-vue-transition-root-validator@0.0.4(vite@7.3.0(@types/node@25.0.3)(jiti@2.6.1)(sass@1.97.1)(tsx@4.21.0)(yaml@2.8.2))(vue@3.5.26(typescript@5.9.3)):
+    dependencies:
+      vite: 7.3.0(@types/node@25.0.3)(jiti@2.6.1)(sass@1.97.1)(tsx@4.21.0)(yaml@2.8.2)
+      vue: 3.5.26(typescript@5.9.3)
+
   vite@7.3.0(@types/node@25.0.3)(jiti@2.6.1)(sass@1.97.1)(tsx@4.21.0)(yaml@2.8.2):
     dependencies:
       esbuild: 0.27.2

src/locales/index.ts

@@ -24,3 +24,7 @@ export const $t = i18n.global.t as App.I18n.$T;
 export function setLocale(locale: App.I18n.LangType) {
   i18n.global.locale.value = locale;
 }
+
+export function getLocale(): App.I18n.LangType {
+  return i18n.global.locale.value as App.I18n.LangType;
+}

src/main.ts

@@ -1,9 +1,10 @@
 import { createApp } from 'vue';
 import './plugins/assets';
+import { setupVueRootValidator } from 'vite-plugin-vue-transition-root-validator/client';
 import { setupAppVersionNotification, setupDayjs, setupIconifyOffline, setupLoading, setupNProgress } from './plugins';
 import { setupStore } from './store';
 import { setupRouter } from './router';
-import { setupI18n } from './locales';
+import { getLocale, setupI18n } from './locales';
 import App from './App.vue';
 
 async function setupApp() {
@@ -25,6 +26,10 @@ async function setupApp() {
 
   setupAppVersionNotification();
 
+  setupVueRootValidator(app, {
+    lang: getLocale() === 'zh-CN' ? 'zh' : 'en'
+  });
+
   app.mount('#app');
 }