feat(i18n): 移除国际化

src/components/i18nComp.vue

@@ -0,0 +1,9 @@
+<template>
+  <select>
+    TODO: i18n
+  </select>
+</template>
+
+<script setup lang="ts"></script>
+
+<style scoped></style>

src/main.ts

@@ -4,23 +4,10 @@ import 'virtual:uno.css';
 
 import { createHead } from '@unhead/vue';
 import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';
-import { createI18n } from 'vue-i18n';
 
 import { DataLoaderPlugin } from 'unplugin-vue-router/data-loaders';
 import App from './App.vue';
 import { router } from './router';
-// 自动导入语言文件
-interface LocaleMessages {
-  [key: string]: string;
-}
-
-const messages = Object.fromEntries(
-  Object.entries(import.meta.glob<Record<string, LocaleMessages>>('./locales/*.json', { eager: true })).map(
-    ([key, value]) => {
-      return [key.slice('./locales/'.length, -5), value.default];
-    },
-  ),
-);
 
 async function init() {
   if (import.meta.env.MODE === 'development' || 1 === 1) {
@@ -42,15 +29,7 @@ async function init() {
     // Register the plugin before the router
     .use(DataLoaderPlugin, { router })
     // adding the router will trigger the initial navigation
-    .use(router)
-    .use(
-      createI18n({
-        legacy: false, // 使用 Composition API 模式
-        locale: 'zh', // 默认语言
-        fallbackLocale: 'en', // 回退语言
-        messages,
-      }),
-    );
+    .use(router);
   app.config.globalProperties.$__DEV__ = $__DEV__;
   app.mount('#app');
 }

src/pages/index-page.vue

@@ -1,4 +1,6 @@
 <script lang="tsx" setup>
+import I18nComp from '../components/i18nComp.vue';
+
 useHead({
   // Titles
   title: 'Hello World',
@@ -14,23 +16,9 @@ definePage({
   alias: '/',
 });
 
-import type { FunctionalComponent } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-const { locale, t } = useI18n({
-  messages: {
-    en: {
-      message: 'This is an important message!',
-    },
-    zh: {
-      message: '这是一条重要消息！',
-    },
-  },
-});
-
 // https://cn.vuejs.org/guide/extras/render-function#typing-functional-components
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-const FComponent: FunctionalComponent<{ prop: string }> = (props, context) => (
+const FComponent: import('vue').FunctionalComponent<{ prop: string }> = (props, context) => (
   // <>
   <div border="1 solid pink" text="pink">
     <span>This is a functional component with prop: {JSON.stringify(props)}</span>
@@ -50,13 +38,7 @@ const FComponent: FunctionalComponent<{ prop: string }> = (props, context) => (
   </ul>
 
   <div b="1px solid pink" mt-8>
-    <select v-model="locale">
-      <option value="zh">中文</option>
-      <option value="en">English</option>
-    </select>
-    <h1>{{ $t('welcome') }}</h1>
-    <p>{{ $t('hello', { name: 'John' }) }}</p>
-    <p class="message">{{ t('message') }}</p>
+    <I18nComp />
   </div>
 
   <FComponent prop="Hello World" style="margin-top: 8px"></FComponent>