refactor: 重构 i18n (#68)

Co-authored-by: Typed SIGTERM <[email protected]>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: 3 people

.gitignore

@@ -31,7 +31,4 @@ coverage
 components.d.ts
 .env
 
-.vscode/**
-!.vscode/extensions.json
-
 src-tauri/gen

.tool-versions

@@ -1 +1 @@
-bun 1.2.14
+bun 1.2.22

.vscode/extensions.json

@@ -5,6 +5,7 @@
     "tauri-apps.tauri-vscode",
     "dbaeumer.vscode-eslint",
     "antfu.unocss",
-    "huacnlee.autocorrect"
+    "huacnlee.autocorrect",
+    "lokalise.i18n-ally"
   ]
 }

.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "i18n-ally.localesPaths": [
+    "src/locales"
+  ],
+  "cSpell.words": [
+    "namelist"
+  ]
+}

bun.lock

@@ -32,7 +32,6 @@
     "@typed-sigterm/eslint-config": "^1.6.0",
     "@types/bun": "^1.2.22",
     "@types/markdown-it": "^14.1.2",
-    "@types/mixpanel-browser": "^2.66.0",
     "@types/semver": "^7.7.1",
     "@vitejs/plugin-vue": "^6.0.1",
     "@vitejs/plugin-vue-jsx": "^5.1.1",
@@ -44,20 +43,22 @@
     "js-confetti": "^0.13.1",
     "markdown-it-for-inline": "^2.0.1",
     "mitt": "^3.0.1",
-    "mixpanel-browser": "^2.70.0",
+    "mixpanel-browser": "^2.71.0",
     "mock-local-storage": "^1.1.24",
     "naive-ui": "^2.43.1",
+    "npm-run-all2": "^8.0.4",
     "pinia": "^3.0.3",
     "postcss-preset-env": "^10.3.1",
     "semver": "^7.7.2",
     "unocss": "^66.5.1",
     "unplugin-icons": "^22.3.0",
     "unplugin-vue-components": "^29.0.0",
     "unplugin-vue-markdown": "^29.1.0",
+    "vite": "^7.1.9",
     "vitest": "^3.2.4",
     "vue": "^3.5.21",
     "vue-i18n": "^11.1.12",
-    "vue-tsc": "3.0.7",
+    "vue-tsc": "^3.1.0",
     "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
     "zod": "^4.1.8"
   },
@@ -66,8 +67,5 @@
     "core-js",
     "esbuild",
     "vue-demi"
-  ],
-  "patchedDependencies": {
-    "@tauri-apps/[email protected]": "patches/@tauri-apps%[email protected]"
-  }
+  ]
 }

package.json

@@ -1,20 +1,20 @@
 <script lang="tsx" setup>
 import { promiseTimeout, useScreenOrientation, watchImmediate } from '@vueuse/core';
-import mp from 'mixpanel-browser';
 import { enUS, zhCN } from 'naive-ui';
 import { computed, markRaw, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useThemeStore } from '@/stores/theme';
-import { __APP__, __GA__, isPortable } from '@/utils/app';
+import { __APP__, isPortable } from '@/utils/app';
 import { bus } from '@/utils/event';
 import { initPortable } from '@/utils/fs';
 import { triggerWelcomeGuide } from '@/utils/guide';
 import { setupI18nHooks, ui } from '@/utils/ui';
+import { initAnalytics } from './utils/analytics';
 
 setupI18nHooks();
 
 const i18n = useI18n();
-const { t } = useI18n({ useScope: 'local' });
+const { t } = i18n;
 watchImmediate(i18n.locale, (v) => {
   document.documentElement.lang = v;
 });
@@ -49,14 +49,14 @@ function alertOrientation() {
 
   return new Promise<void>((resolve) => {
     const modal = ui.dialog.info({
-      title: t('orientation.title'),
+      title: t('app.orientation.title'),
       content: () => (
         <>
-          <p class="m-0">{t('orientation.content-1')}</p>
-          <p class="mt-1">{t('orientation.content-2')}</p>
+          <p class="m-0">{t('app.orientation.content-1')}</p>
+          <p class="mt-1">{t('app.orientation.content-2')}</p>
         </>
       ),
-      positiveText: i18n.t('confirm'),
+      positiveText: t('confirm'),
       closable: false,
       onPositiveClick: () => closedOrientation = true, // 手动关闭，下次不再弹窗
       onAfterLeave: resolve,
@@ -77,14 +77,6 @@ watch(orientation, () => {
     alertOrientation();
 });
 
-const token = import.meta.env.EXC_MIXPANEL_TOKEN;
-mp.init(token, {
-  persistence: 'localStorage',
-  track_pageview: __GA__,
-});
-if (!__GA__)
-  mp.disable();
-
 // portable 下 localStorage 与文件同步
 onMounted(async () => {
   if (__APP__ && await isPortable()) // tree-shake
@@ -94,6 +86,8 @@ onMounted(async () => {
 function hideSpin() {
   document.getElementById('app')!.removeAttribute('data-loading');
 }
+
+onMounted(initAnalytics);
 </script>
 
 <template>
@@ -120,17 +114,3 @@ function hideSpin() {
   transition: opacity 0.3s;
 }
 </style>
-
-<i18n lang="yaml">
-en:
-  orientation:
-    title: Prefer Landscape Mode
-    content-1: ExCaller is designed to be used in landscape mode, and may have UI issues in portrait mode.
-    content-2: You can open the notification bar and enable "Auto-rotate", then rotate your device to landscape mode.
-
-zh-CN:
-  orientation:
-    title: 推荐横屏使用
-    content-1: ExCaller 被设计为横屏使用，竖屏使用可能出现问题。
-    content-2: 您可以下拉通知栏打开“自动旋转”，并将设备旋转至横屏模式。
-</i18n>

patches/@tauri-apps%[email protected]

@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 import { __CANARY__, getBuildMeta, GITHUB_REPO_URL } from '@/utils/app';
 import ChangelogMd from '../../CHANGELOG.md';
 
-const { t } = useI18n({ useScope: 'local' });
+const { t } = useI18n();
 const meta = getBuildMeta();
 
 const canaryLink = computed(() => {
@@ -24,21 +24,11 @@ const canaryLink = computed(() => {
 
     <br>
 
-    {{ t('build-time') }}
+    {{ t('changelog.build-time') }}
     <NTime :time="meta.buildTime" />
   </NAlert>
 
   <ChangelogWrapper>
     <ChangelogMd />
   </ChangelogWrapper>
 </template>
-
-<i18n lang="yaml">
-en:
-  canary-tip: For the latest changes in the canary version, please visit {0}.
-  build-time: "Build time:"
-
-zh-CN:
-  canary-tip: Canary 版本更新内容请前往 {0} 查看。
-  build-time: 构建时间：
-</i18n>

src/app.vue

@@ -8,7 +8,7 @@ const { value } = defineProps<{
   describes: string
 }>();
 
-const { t } = useI18n({ useScope: 'local' });
+const { t } = useI18n();
 const { copy, copied, isSupported } = useClipboard();
 
 const expanded = ref(false);
@@ -25,7 +25,7 @@ const [DefineOperations, Operations] = createReusableTemplate();
       <template #trigger>
         <ILucideCircleHelp :size="20" />
       </template>
-      {{ t('notes', [describes]) }}
+      {{ t('checksum.notes', [describes]) }}
     </NTooltip>
 
     <NTooltip v-if="isSupported">
@@ -40,34 +40,20 @@ const [DefineOperations, Operations] = createReusableTemplate();
       <template #trigger>
         <ILucideMinus :size="20" @click="expanded = false" />
       </template>
-      {{ t('collapse') }}
+      {{ t('checksum.collapse') }}
     </NTooltip>
     <NTooltip v-else>
       <template #trigger>
         <ILucidePlus :size="20" @click="expanded = true" />
       </template>
-      {{ t('expand') }}
+      {{ t('checksum.expand') }}
     </NTooltip>
   </DefineOperations>
 
   <p v-if="value" class="flex flex-wrap items-center gap-1">
-    <span v-text="t('label')" />
+    <span v-text="t('checksum.label')" />
     <Operations v-if="expanded" />
     <span class="border-1 font-mono break-anywhere mr-1" v-text="shown" />
     <Operations v-if="!expanded" />
   </p>
 </template>
-
-<i18n lang="yaml">
-en:
-  label: 'Checksum:'
-  notes: Used to verify the integrity of {0}. If {0} is modified, the entire checksum will change
-  expand: Expand
-  collapse: Collapse
-
-zh-CN:
-  label: 校验码：
-  notes: 用于验证{0}完整性，若{0}被修改，整串校验码会改变
-  expand: 展开
-  collapse: 收起
-</i18n>