Remove unplugin-vue-i18n and change language file format

去除unplugin-vue-i18n，语言文件改为json格式，把i18n-ally的localespaths设置为"src/locales/lang"就可以用。缺少downloader及calendar及format问题也一并修改。
2026-04-14 02:20:53 +08:00 · 2023-06-12 13:08:36 +08:00
parent 5dd0d84a79
commit a9c037e69c
27 changed files with 394 additions and 516 deletions
--- a/webui/package.json
+++ b/webui/package.json
@@ -30,7 +30,6 @@
  "devDependencies": {
    "@antfu/eslint-config": "^0.38.6",
    "@icon-park/vue-next": "^1.4.2",
-    "@intlify/unplugin-vue-i18n": "^0.11.0",
    "@storybook/addon-essentials": "^7.0.12",
    "@storybook/addon-interactions": "^7.0.12",
    "@storybook/addon-links": "^7.0.12",
--- a/webui/pnpm-lock.yaml
+++ b/webui/pnpm-lock.yaml
@@ -40,9 +40,6 @@ devDependencies:
  '@icon-park/vue-next':
    specifier: ^1.4.2
    version: 1.4.2(vue@3.3.4)
-  '@intlify/unplugin-vue-i18n':
-    specifier: ^0.11.0
-    version: 0.11.0(vue-i18n@9.2.2)
  '@storybook/addon-essentials':
    specifier: ^7.0.12
    version: 7.0.12(react-dom@18.2.0)(react@18.2.0)
@@ -1850,31 +1847,6 @@ packages:
      - supports-color
    dev: true

-  /@intlify/bundle-utils@6.0.1(vue-i18n@9.2.2):
-    resolution: {integrity: sha512-BkeZNKZiC0B7K3OYMwiPLoAqsZmKH3SxTL75vYAkuQ//XWR8WO0NpfjXhTxgLTVFHxMcNb2agAopC0DP6fqDrg==}
-    engines: {node: '>= 14.16'}
-    peerDependencies:
-      petite-vue-i18n: '*'
-      vue-i18n: '*'
-    peerDependenciesMeta:
-      petite-vue-i18n:
-        optional: true
-      vue-i18n:
-        optional: true
-    dependencies:
-      '@intlify/message-compiler': 9.3.0-beta.17
-      '@intlify/shared': 9.3.0-beta.17
-      acorn: 8.8.2
-      escodegen: 2.0.0
-      estree-walker: 2.0.2
-      jsonc-eslint-parser: 1.4.1
-      magic-string: 0.30.0
-      mlly: 1.2.1
-      source-map: 0.6.1
-      vue-i18n: 9.2.2(vue@3.3.4)
-      yaml-eslint-parser: 0.3.2
-    dev: true
-
  /@intlify/core-base@9.2.2:
    resolution: {integrity: sha512-JjUpQtNfn+joMbrXvpR4hTF8iJQ2sEFzzK3KIESOx+f+uwIjgw20igOyaIdhfsVVBCds8ZM64MoeNSx+PHQMkA==}
    engines: {node: '>= 14'}
@@ -1883,12 +1855,14 @@ packages:
      '@intlify/message-compiler': 9.2.2
      '@intlify/shared': 9.2.2
      '@intlify/vue-devtools': 9.2.2
+    dev: false

  /@intlify/devtools-if@9.2.2:
    resolution: {integrity: sha512-4ttr/FNO29w+kBbU7HZ/U0Lzuh2cRDhP8UlWOtV9ERcjHzuyXVZmjyleESK6eVP60tGC9QtQW9yZE+JeRhDHkg==}
    engines: {node: '>= 14'}
    dependencies:
      '@intlify/shared': 9.2.2
+    dev: false

  /@intlify/message-compiler@9.2.2:
    resolution: {integrity: sha512-IUrQW7byAKN2fMBe8z6sK6riG1pue95e5jfokn8hA5Q3Bqy4MBJ5lJAofUsawQJYHeoPJ7svMDyBaVJ4d0GTtA==}
@@ -1896,56 +1870,12 @@ packages:
    dependencies:
      '@intlify/shared': 9.2.2
      source-map: 0.6.1
-
-  /@intlify/message-compiler@9.3.0-beta.17:
-    resolution: {integrity: sha512-i7hvVIRk1Ax2uKa9xLRJCT57to08OhFMhFXXjWN07rmx5pWQYQ23MfX1xgggv9drnWTNhqEiD+u4EJeHoS5+Ww==}
-    engines: {node: '>= 14'}
-    dependencies:
-      '@intlify/shared': 9.3.0-beta.17
-      source-map: 0.6.1
-    dev: true
+    dev: false

  /@intlify/shared@9.2.2:
    resolution: {integrity: sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q==}
    engines: {node: '>= 14'}
-
-  /@intlify/shared@9.3.0-beta.17:
-    resolution: {integrity: sha512-mscf7RQsUTOil35jTij4KGW1RC9SWQjYScwLxP53Ns6g24iEd5HN7ksbt9O6FvTmlQuX77u+MXpBdfJsGqizLQ==}
-    engines: {node: '>= 14'}
-    dev: true
-
-  /@intlify/unplugin-vue-i18n@0.11.0(vue-i18n@9.2.2):
-    resolution: {integrity: sha512-ivcLZo08fvepHWV8o5lcKfhcKFSWqhwrqIAU6pUIbvq2ICo9fnXnIPYIZj7FeuHDLW1G3ADm44ZhQC3nYmvDlg==}
-    engines: {node: '>= 14.16'}
-    peerDependencies:
-      petite-vue-i18n: '*'
-      vue-i18n: '*'
-      vue-i18n-bridge: '*'
-    peerDependenciesMeta:
-      petite-vue-i18n:
-        optional: true
-      vue-i18n:
-        optional: true
-      vue-i18n-bridge:
-        optional: true
-    dependencies:
-      '@intlify/bundle-utils': 6.0.1(vue-i18n@9.2.2)
-      '@intlify/shared': 9.3.0-beta.17
-      '@rollup/pluginutils': 5.0.2
-      '@vue/compiler-sfc': 3.3.4
-      debug: 4.3.4
-      fast-glob: 3.2.12
-      js-yaml: 4.1.0
-      json5: 2.2.3
-      pathe: 1.1.0
-      picocolors: 1.0.0
-      source-map: 0.6.1
-      unplugin: 1.3.1
-      vue-i18n: 9.2.2(vue@3.3.4)
-    transitivePeerDependencies:
-      - rollup
-      - supports-color
-    dev: true
+    dev: false

  /@intlify/vue-devtools@9.2.2:
    resolution: {integrity: sha512-+dUyqyCHWHb/UcvY1MlIpO87munedm3Gn6E9WWYdWrMuYLcoIoOEVDWSS8xSwtlPU+kA+MEQTP6Q1iI/ocusJg==}
@@ -1953,6 +1883,7 @@ packages:
    dependencies:
      '@intlify/core-base': 9.2.2
      '@intlify/shared': 9.2.2
+    dev: false

  /@istanbuljs/load-nyc-config@1.1.0:
    resolution: {integrity: sha512-VjeHSlIzpv/NyD3N0YuHfXOPDIixcA1q2ZV98wsMqcYlPmv2n3Yb2lYP9XMElnaFVXg5A7YLTeLu6V84uQDjmQ==}
@@ -3838,14 +3769,6 @@ packages:
      negotiator: 0.6.3
    dev: true

-  /acorn-jsx@5.3.2(acorn@7.4.1):
-    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
-    peerDependencies:
-      acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
-    dependencies:
-      acorn: 7.4.1
-    dev: true
-
  /acorn-jsx@5.3.2(acorn@8.8.2):
    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
    peerDependencies:
@@ -5127,19 +5050,6 @@ packages:
    engines: {node: '>=12'}
    dev: true

-  /escodegen@2.0.0:
-    resolution: {integrity: sha512-mmHKys/C8BFUGI+MAWNcSYoORYLMdPzjrknd2Vc+bUsjN5bXcr8EhrNB+UTqfL1y3I9c4fw2ihgtMPQLBRiQxw==}
-    engines: {node: '>=6.0'}
-    hasBin: true
-    dependencies:
-      esprima: 4.0.1
-      estraverse: 5.3.0
-      esutils: 2.0.3
-      optionator: 0.8.3
-    optionalDependencies:
-      source-map: 0.6.1
-    dev: true
-
  /eslint-config-prettier@8.8.0(eslint@8.41.0):
    resolution: {integrity: sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA==}
    hasBin: true
@@ -5525,15 +5435,6 @@ packages:
      - supports-color
    dev: true

-  /espree@6.2.1:
-    resolution: {integrity: sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==}
-    engines: {node: '>=6.0.0'}
-    dependencies:
-      acorn: 7.4.1
-      acorn-jsx: 5.3.2(acorn@7.4.1)
-      eslint-visitor-keys: 1.3.0
-    dev: true
-
  /espree@9.5.2:
    resolution: {integrity: sha512-7OASN1Wma5fum5SrNhFMAMJxOUAbhyfQ8dQ//PJaJbNw0URTPWqIghHWt1MmAANKhHZIYOHruW4Kw4ruUWOdGw==}
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -6775,17 +6676,6 @@ packages:
    hasBin: true
    dev: true

-  /jsonc-eslint-parser@1.4.1:
-    resolution: {integrity: sha512-hXBrvsR1rdjmB2kQmUjf1rEIa+TqHBGMge8pwi++C+Si1ad7EjZrJcpgwym+QGK/pqTx+K7keFAtLlVNdLRJOg==}
-    engines: {node: '>=8.10.0'}
-    dependencies:
-      acorn: 7.4.1
-      eslint-utils: 2.1.0
-      eslint-visitor-keys: 1.3.0
-      espree: 6.2.1
-      semver: 6.3.0
-    dev: true
-
  /jsonc-eslint-parser@2.3.0:
    resolution: {integrity: sha512-9xZPKVYp9DxnM3sd1yAsh/d59iIaswDkai8oTxbursfKYbg/ibjX0IzFt35+VZ8iEW453TVTXztnRvYUQlAfUQ==}
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -6843,14 +6733,6 @@ packages:
    engines: {node: '>=6'}
    dev: true

-  /levn@0.3.0:
-    resolution: {integrity: sha512-0OO4y2iOHix2W6ujICbKIaEQXvFQHue65vUG3pb5EUomzPI90z9hsA1VsO/dbIIpC53J8gxM9Q4Oho0jrCM/yA==}
-    engines: {node: '>= 0.8.0'}
-    dependencies:
-      prelude-ls: 1.1.2
-      type-check: 0.3.2
-    dev: true
-
  /levn@0.4.1:
    resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
    engines: {node: '>= 0.8.0'}
@@ -7439,18 +7321,6 @@ packages:
      is-wsl: 2.2.0
    dev: true

-  /optionator@0.8.3:
-    resolution: {integrity: sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==}
-    engines: {node: '>= 0.8.0'}
-    dependencies:
-      deep-is: 0.1.4
-      fast-levenshtein: 2.0.6
-      levn: 0.3.0
-      prelude-ls: 1.1.2
-      type-check: 0.3.2
-      word-wrap: 1.2.3
-    dev: true
-
  /optionator@0.9.1:
    resolution: {integrity: sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==}
    engines: {node: '>= 0.8.0'}
@@ -7708,11 +7578,6 @@ packages:
      picocolors: 1.0.0
      source-map-js: 1.0.2

-  /prelude-ls@1.1.2:
-    resolution: {integrity: sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w==}
-    engines: {node: '>= 0.8.0'}
-    dev: true
-
  /prelude-ls@1.2.1:
    resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
    engines: {node: '>= 0.8.0'}
@@ -8802,13 +8667,6 @@ packages:
      typescript: 4.9.5
    dev: true

-  /type-check@0.3.2:
-    resolution: {integrity: sha512-ZCmOJdvOWDBYJlzAoFkC+Q0+bUyEOS1ltgp1MGU03fqHG+dbi9tBFU2Rd9QKiDZFAYrhPh2JUf7rZRIuHRKtOg==}
-    engines: {node: '>= 0.8.0'}
-    dependencies:
-      prelude-ls: 1.1.2
-    dev: true
-
  /type-check@0.4.0:
    resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
    engines: {node: '>= 0.8.0'}
@@ -9425,6 +9283,7 @@ packages:
      '@intlify/vue-devtools': 9.2.2
      '@vue/devtools-api': 6.5.0
      vue: 3.3.4
+    dev: false

  /vue-inbrowser-compiler-independent-utils@4.71.1(vue@3.3.4):
    resolution: {integrity: sha512-K3wt3iVmNGaFEOUR4JIThQRWfqokxLfnPslD41FDZB2ajXp789+wCqJyGYlIFsvEQ2P61PInw6/ph5iiqg51gg==}
@@ -9682,14 +9541,6 @@ packages:
    resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==}
    dev: true

-  /yaml-eslint-parser@0.3.2:
-    resolution: {integrity: sha512-32kYO6kJUuZzqte82t4M/gB6/+11WAuHiEnK7FreMo20xsCKPeFH5tDBU7iWxR7zeJpNnMXfJyXwne48D0hGrg==}
-    dependencies:
-      eslint-visitor-keys: 1.3.0
-      lodash: 4.17.21
-      yaml: 1.10.2
-    dev: true
-
  /yaml-eslint-parser@1.2.2:
    resolution: {integrity: sha512-pEwzfsKbTrB8G3xc/sN7aw1v6A6c/pKxLAkjclnAyo5g5qOh6eL9WGu0o3cSDQZKrTNk4KL4lQSwZW+nBkANEg==}
    engines: {node: ^14.17.0 || >=16.0.0}
@@ -9699,11 +9550,6 @@ packages:
      yaml: 2.2.2
    dev: true

-  /yaml@1.10.2:
-    resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==}
-    engines: {node: '>= 6'}
-    dev: true
-
  /yaml@2.2.2:
    resolution: {integrity: sha512-CBKFWExMn46Foo4cldiChEzn7S7SRV+wqiluAb6xmueD/fGyRHIhX8m14vVGgeFWjN540nKCNVj6P21eQjgTuA==}
    engines: {node: '>= 14'}
--- a/webui/src/components/ab-add-bangumi.vue
+++ b/webui/src/components/ab-add-bangumi.vue
@@ -124,9 +124,9 @@ async function subscribe() {
      ></ab-setting>

      <div flex="~ justify-end">
-        <ab-button size="small" :loading="analysis.loading" @click="analyser"
-          >{{$t('topbar.add.analyse')}}</ab-button
-        >
+        <ab-button size="small" :loading="analysis.loading" @click="analyser">{{
+          $t('topbar.add.analyse')
+        }}</ab-button>
      </div>
    </div>

--- a/webui/src/components/ab-change-account.vue
+++ b/webui/src/components/ab-change-account.vue
@@ -7,7 +7,11 @@ const { user, update } = useAuth();
 </script>

 <template>
-  <ab-popup v-model:show="show" :title="$t('topbar.profile.poptitle')" css="w-365px">
+  <ab-popup
+    v-model:show="show"
+    :title="$t('topbar.profile.poptitle')"
+    css="w-365px"
+  >
    <div space-y-16px>
      <ab-label :label="$t('topbar.profile.username')">
        <input
@@ -30,7 +34,9 @@ const { user, update } = useAuth();
      <div line></div>

      <div flex="~ justify-end">
-        <ab-button size="small" @click="update">{{$t('topbar.profile.updatebtn')}}</ab-button>
+        <ab-button size="small" @click="update">{{
+          $t('topbar.profile.updatebtn')
+        }}</ab-button>
      </div>
    </div>
  </ab-popup>
--- a/webui/src/components/ab-edit-rule.vue
+++ b/webui/src/components/ab-edit-rule.vue
@@ -1,8 +1,7 @@
 <script lang="ts" setup>
-import type { BangumiRule } from '#/bangumi';
 import { useI18n } from 'vue-i18n';
+import type { BangumiRule } from '#/bangumi';

-const { t } = useI18n({ useScope: 'global' });
 const emit = defineEmits<{
  (e: 'apply', rule: BangumiRule): void;
  (e: 'enable', id: number): void;
@@ -12,7 +11,7 @@ const emit = defineEmits<{
    opts: { id: number; deleteFile: boolean }
  ): void;
 }>();
-
+const { t } = useI18n({ useScope: 'global' });
 const show = defineModel('show', { default: false });
 const rule = defineModel<BangumiRule>('rule', {
  required: true,
@@ -72,15 +71,17 @@ const boxSize = computed(() => {
 <template>
  <ab-popup v-model:show="show" :title="popupTitle" :css="boxSize">
    <div v-if="rule.deleted">
-      <div>{{$t('homepage.rule.enablehit')}}</div>
+      <div>{{ $t('homepage.rule.enablehit') }}</div>

      <div line my-8px></div>

      <div fx-cer justify-center space-x-10px>
-        <ab-button size="small" type="warn" @click="() => emitEnable()"
-          >{{$t('homepage.rule.yesbtn')}}</ab-button
-        >
-        <ab-button size="small" @click="() => close()">{{$t('homepage.rule.nobtn')}}</ab-button>
+        <ab-button size="small" type="warn" @click="() => emitEnable()">{{
+          $t('homepage.rule.yesbtn')
+        }}</ab-button>
+        <ab-button size="small" @click="() => close()">{{
+          $t('homepage.rule.nobtn')
+        }}</ab-button>
      </div>
    </div>

@@ -92,29 +93,37 @@ const boxSize = computed(() => {
          size="small"
          type="warn"
          @click="() => showDeleteFileDialog('disable')"
-          >{{$t('homepage.rule.disable')}}</ab-button
+          >{{ $t('homepage.rule.disable') }}</ab-button
        >
        <ab-button
          size="small"
          type="warn"
          @click="() => showDeleteFileDialog('delete')"
-          >{{$t('homepage.rule.delete')}}</ab-button
+          >{{ $t('homepage.rule.delete') }}</ab-button
        >
-        <ab-button size="small" @click="emitApply">{{$t('homepage.rule.apply')}}</ab-button>
+        <ab-button size="small" @click="emitApply">{{
+          $t('homepage.rule.apply')
+        }}</ab-button>
      </div>
    </div>

-    <ab-popup v-model:show="deleteFileDialog.show" :title="$t('homepage.rule.delete')">
-      <div>{{$t('homepage.rule.deletehit')}}</div>
+    <ab-popup
+      v-model:show="deleteFileDialog.show"
+      :title="$t('homepage.rule.delete')"
+    >
+      <div>{{ $t('homepage.rule.deletehit') }}</div>
      <div line my-8px></div>

      <div fx-cer justify-center space-x-10px>
-        <ab-button size="small" type="warn" @click="() => emitdeleteFile(true)"
-          >{{$t('homepage.rule.yesbtn')}}</ab-button
-        >
-        <ab-button size="small" @click="() => emitdeleteFile(false)"
-          >{{$t('homepage.rule.nobtn')}}</ab-button
+        <ab-button
+          size="small"
+          type="warn"
+          @click="() => emitdeleteFile(true)"
+          >{{ $t('homepage.rule.yesbtn') }}</ab-button
        >
+        <ab-button size="small" @click="() => emitdeleteFile(false)">{{
+          $t('homepage.rule.nobtn')
+        }}</ab-button>
      </div>
    </ab-popup>
  </ab-popup>
--- a/webui/src/components/ab-rule.vue
+++ b/webui/src/components/ab-rule.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type { BangumiRule } from '#/bangumi';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n';

 const { t } = useI18n({ useScope: 'global' });
 const rule = defineModel<BangumiRule>('rule', {
--- a/webui/src/components/ab-status-bar.vue
+++ b/webui/src/components/ab-status-bar.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue';
-import { Earth, AddOne, More } from '@icon-park/vue-next';
+import { AddOne, Earth, More } from '@icon-park/vue-next';

 withDefaults(
  defineProps<{
@@ -32,7 +32,7 @@ defineEmits(['clickAdds']);
          btn-click
          @click="() => $emit('changeLang')"
        />
-        
+
        <AddOne
          theme="outline"
          size="24"
--- a/webui/src/components/layout/ab-sidebar.vue
+++ b/webui/src/components/layout/ab-sidebar.vue
@@ -10,7 +10,7 @@ import {
  SettingTwo,
 } from '@icon-park/vue-next';
 import { useI18n } from 'vue-i18n';
-const { t } = useI18n({ useScope: 'global' });
+
 const props = withDefaults(
  defineProps<{
    open?: boolean;
@@ -19,7 +19,7 @@ const props = withDefaults(
    open: false,
  }
 );
-
+const { t } = useI18n({ useScope: 'global' });
 const show = ref(props.open);
 const toggle = () => (show.value = !show.value);
 const route = useRoute();
@@ -89,7 +89,7 @@ const items = [
        @click="toggle"
      >
        <div :class="[!show && 'abs opacity-0']" transition-opacity>
-          <div text-h1>{{$t('sidebar.title')}}</div>
+          <div text-h1>{{ $t('sidebar.title') }}</div>
        </div>

        <MenuUnfold
@@ -139,7 +139,7 @@ const items = [
        @click="logout"
      >
        <Logout :size="24" />
-        <div text-h2>{{$t('sidebar.logout')}}</div>
+        <div text-h2>{{ $t('sidebar.logout') }}</div>
      </div>
    </div>
  </div>
--- a/webui/src/components/layout/ab-topbar.vue
+++ b/webui/src/components/layout/ab-topbar.vue
@@ -8,6 +8,7 @@ import {
  Refresh,
 } from '@icon-park/vue-next';
 import { useI18n } from 'vue-i18n';
+
 const { t, locale } = useI18n({ useScope: 'global' });
 const search = ref('');
 const show = ref(false);
@@ -66,14 +67,14 @@ onUnmounted(() => {
  offUpdate();
 });

-function changeLocale(){
-  if(localStorage.getItem('lang') === 'zh-CN'){
-    let newLang = 'en-US';
+function changeLocale() {
+  if (localStorage.getItem('lang') === 'zh-CN') {
+    const newLang = 'en-US';
    locale.value = newLang;
    localStorage.setItem('lang', newLang);
    location.reload();
  } else {
-    let newLang = 'zh-CN';
+    const newLang = 'zh-CN';
    locale.value = newLang;
    localStorage.setItem('lang', newLang);
    location.reload();
@@ -91,7 +92,7 @@ function changeLocale(){
    <ab-search v-model:value="search" hidden />

    <div ml-auto>
-        <ab-status-bar
+      <ab-status-bar
        :items="items"
        :running="running"
        @click-add="() => (showAdd = true)"
--- a/webui/src/components/setting/config-download.vue
+++ b/webui/src/components/setting/config-download.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type { Downloader, DownloaderType } from '#/config';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n';

 const { t } = useI18n({ useScope: 'global' });
 const { getSettingGroup } = useConfigStore();
--- a/webui/src/components/setting/config-manage.vue
+++ b/webui/src/components/setting/config-manage.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type { BangumiManage, RenameMethod } from '#/config';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n';

 const { t } = useI18n({ useScope: 'global' });
 const { getSettingGroup } = useConfigStore();
--- a/webui/src/components/setting/config-normal.vue
+++ b/webui/src/components/setting/config-normal.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type { Log, Program } from '#/config';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n'

-const { t } = useI18n({ useScope: 'global' })
+const { t } = useI18n({ useScope: 'global' });
 const { getSettingGroup } = useConfigStore();

 const program = getSettingGroup('program');
--- a/webui/src/components/setting/config-notification.vue
+++ b/webui/src/components/setting/config-notification.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type { Notification, NotificationType } from '#/config';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n';

 const { t } = useI18n({ useScope: 'global' });
 const { getSettingGroup } = useConfigStore();
@@ -17,13 +17,13 @@ const notificationType: NotificationType = [
 const items: SettingItem<Notification>[] = [
  {
    configKey: 'enable',
-    label: t("config.notificationset.enable"),
+    label: t('config.notificationset.enable'),
    type: 'switch',
    bottomLine: true,
  },
  {
    configKey: 'type',
-    label: t("config.notificationset.type"),
+    label: t('config.notificationset.type'),
    type: 'select',
    css: 'w-140px',
    prop: {
@@ -32,7 +32,7 @@ const items: SettingItem<Notification>[] = [
  },
  {
    configKey: 'token',
-    label: t("config.notificationset.token"),
+    label: t('config.notificationset.token'),
    type: 'input',
    prop: {
      type: 'text',
@@ -41,7 +41,7 @@ const items: SettingItem<Notification>[] = [
  },
  {
    configKey: 'chat_id',
-    label: t("config.notificationset.chatid"),
+    label: t('config.notificationset.chatid'),
    type: 'input',
    prop: {
      type: 'text',
--- a/webui/src/components/setting/config-parser.vue
+++ b/webui/src/components/setting/config-parser.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type {
  RssParser,
  RssParserLang,
@@ -6,7 +7,6 @@ import type {
  RssParserType,
 } from '#/config';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n';

 const { t } = useI18n({ useScope: 'global' });
 const { getSettingGroup } = useConfigStore();
--- a/webui/src/components/setting/config-proxy.vue
+++ b/webui/src/components/setting/config-proxy.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import type { Proxy, ProxyType } from '#/config';
 import type { SettingItem } from '#/components';
-import { useI18n } from 'vue-i18n';

 const { t } = useI18n({ useScope: 'global' });
 const { getSettingGroup } = useConfigStore();
--- a/webui/src/locales/index.ts
+++ b/webui/src/locales/index.ts
@@ -1,22 +1,28 @@
 import { createI18n } from 'vue-i18n';
-import messages from '@intlify/unplugin-vue-i18n/messages'
+import enUS from './lang/en-US.json';
+import zhCN from './lang/zh-CN.json';

-//Default language is the same as last setting (undefined is browser language)
+const messages = {
+  'en-US': enUS,
+  'zh-CN': zhCN,
+};
+
+// Default language is the same as last setting (undefined is browser language)
 let lang = localStorage.getItem('lang');
-if(lang === null){
-    const navLang = navigator.language;
-    let localLang = navLang || false;
-    lang = localLang || 'en-US';
+if (lang === null) {
+  const navLang = navigator.language;
+  const localLang = navLang || false;
+  lang = localLang || 'en-US';
 }
 localStorage.setItem('lang', lang);

 const i18n = createI18n({
-    legacy: false,
-    locale: lang,
-    globalInjection: true,
-    silentTranslationWarn: true,
-    globalInstall: true,
-    messages
-  })
+  legacy: false,
+  locale: lang,
+  globalInjection: true,
+  silentTranslationWarn: true,
+  globalInstall: true,
+  messages,
+});

-export default i18n;
+export default i18n;
--- a/webui/src/locales/lang/en-US.json
+++ b/webui/src/locales/lang/en-US.json
@@ -0,0 +1,132 @@
+{
+  "login": {
+    "title": "Login",
+    "username": "Username",
+    "password": "Password",
+    "loginbtn": "Login",
+    "default": "Default"
+  },
+  "sidebar": {
+    "title": "Menu",
+    "homepage": "HomePage",
+    "player": "Player",
+    "log": "Log",
+    "config": "Config",
+    "logout": "Logout",
+    "downloader": "Downloader",
+    "calendar": "Calendar"
+  },
+  "topbar": {
+    "start": "Start",
+    "pause": "Pause",
+    "restart": "Restart",
+    "shutdown": "Shutdown",
+    "resetrule": "Reset Rule",
+    "profile": {
+      "title": "Profile",
+      "poptitle": "Change Account",
+      "username": "Username",
+      "password": "Password",
+      "updatebtn": "Update"
+    },
+    "add": {
+      "title": "Add Bangumi",
+      "rsslink": "RSS Link",
+      "placeholder": "Please enter the RSS link",
+      "analyse": "Analyse"
+    }
+  },
+  "homepage": {
+    "title": "Bangumi List",
+    "rule": {
+      "officaltitle": "Official Title",
+      "year": "Year",
+      "season": "Season",
+      "offset": "Offset",
+      "exclude": "Exclude",
+      "enable": "Enable",
+      "disable": "Disable",
+      "delete": "Delete",
+      "apply": "Apply",
+      "yesbtn": "Yes",
+      "nobtn": "No",
+      "enablehit": "Do you want to enable this rule?",
+      "deletehit": "Delete Local File?",
+      "enablerule": "Enable Rule",
+      "editrule": "Edit Rule"
+    }
+  },
+  "player": {
+    "title": "Player",
+    "hit": "Please set up the media player"
+  },
+  "log": {
+    "title": "Log",
+    "reset": "Reset",
+    "copy": "Copy",
+    "contactinfo": "Contact Infomation",
+    "go": "Go",
+    "join": "Join",
+    "bugrepo": "Bug Report"
+  },
+  "config": {
+    "title": "Config",
+    "normalset": {
+      "title": "Normal Setting",
+      "rssintvl": "Interval Time of Rss",
+      "renameintvl": "Interval Time of Rename",
+      "webport": "WebUI Port",
+      "debug": "Debug"
+    },
+    "parserset": {
+      "title": "Parser Setting",
+      "enable": "Enable",
+      "source": "Source",
+      "token": "Token",
+      "url": "Custom Url",
+      "language": "Language",
+      "type": "Parser Type",
+      "exclude": "Exclude"
+    },
+    "downloaderset": {
+      "title": "Downloader Setting",
+      "type": "Downloader Type",
+      "host": "Host",
+      "username": "Username",
+      "password": "Password",
+      "path": "Download Path",
+      "ssl": "SSL"
+    },
+    "manageset": {
+      "title": "Manage Setting",
+      "enable": "Enable",
+      "method": "Rename Method",
+      "eps": "EPS complete",
+      "grouptag": "Add Group Tag",
+      "deletebadtorr": "Delete Bad Torrent"
+    },
+    "notificationset": {
+      "title": "Notification Setting",
+      "enable": "Enable",
+      "type": "Type",
+      "token": "Token",
+      "chatid": "Chat ID"
+    },
+    "proxyset": {
+      "title": "Proxy Setting",
+      "enable": "Enable",
+      "type": "Proxy Type",
+      "host": "Host",
+      "port": "Port",
+      "username": "Username",
+      "password": "Password"
+    },
+    "mediaplayerset": {
+      "title": "Media Player Setting",
+      "type": "type",
+      "url": "url"
+    },
+    "cancel": "Cancel",
+    "apply": "Apply"
+  }
+}
--- a/webui/src/locales/lang/en-US.yaml
+++ b/webui/src/locales/lang/en-US.yaml
@@ -1,127 +0,0 @@
-login:
-  title: 'Login'
-  username: 'Username'
-  password: 'Password'
-  loginbtn: 'Login'
-  default: 'Default'
-
-sidebar:
-  title: 'Menu'
-  homepage: 'HomePage'
-  player: 'Player'
-  log: 'Log'
-  config: 'Config'
-  logout: 'Logout'
-
-topbar:
-  start: 'Start'
-  pause: 'Pause'
-  restart: 'Restart'
-  shutdown: 'Shutdown'
-  resetrule: 'Reset Rule'
-
-  profile: 
-    title: 'Profile'
-    poptitle: 'Change Account'
-    username: 'Username'
-    password: 'Password'
-    updatebtn: 'Update'
-    
-  add:
-    title: 'Add Bangumi'
-    rsslink: 'RSS Link'
-    placeholder: 'Please enter the RSS link'
-    analyse: 'Analyse'
-
-homepage:
-  title: 'Bangumi List'
-  rule: 
-    officaltitle: 'Official Title'
-    year: 'Year'
-    season: 'Season'
-    offset: 'Offset'
-    exclude: 'Exclude'
-    enable: 'Enable'
-    disable: 'Disable'
-    delete: 'Delete'
-    apply: 'Apply'
-    yesbtn: 'Yes'
-    nobtn: 'No'
-    enablehit: 'Do you want to enable this rule?'
-    deletehit: 'Delete Local File?'
-    enablerule: 'Enable Rule'
-    editrule: 'Edit Rule'
-
-player:
-  title: 'Player'
-  hit: 'Please set up the media player'
-
-log:
-  title: 'Log'
-  reset: 'Reset'
-  copy: 'Copy'
-  contactinfo: 'Contact Infomation'
-  go: 'Go'
-  join: 'Join'
-  bugrepo: 'Bug Report'
-
-config:
-  title: 'Config'
-  normalset: 
-    title: 'Normal Setting'
-    rssintvl: 'Interval Time of Rss'
-    renameintvl: 'Interval Time of Rename'
-    webport: 'WebUI Port'
-    debug: 'Debug'
-
-  parserset: 
-    title: 'Parser Setting'
-    enable: 'Enable'
-    source: 'Source'
-    token: 'Token'
-    url: 'Custom Url'
-    language: 'Language'
-    type: 'Parser Type'
-    exclude: 'Exclude'
-
-  downloaderset: 
-    title: 'Downloader Setting'
-    type: 'Downloader Type'
-    host: 'Host'
-    username: 'Username'
-    password: 'Password'
-    path: 'Download Path'
-    ssl: 'SSL'
-  
-  manageset: 
-    title: 'Manage Setting'
-    enable: 'Enable'
-    method: 'Rename Method'
-    eps: 'EPS complete'
-    grouptag: 'Add Group Tag'
-    deletebadtorr: 'Delete Bad Torrent'
-
-  notificationset: 
-    title: 'Notification Setting'
-    enable: 'Enable'
-    type: 'Type'
-    token: 'Token'
-    chatid: 'Chat ID'
-
-  proxyset: 
-    title: 'Proxy Setting'
-    enable: 'Enable'
-    type: 'Proxy Type'
-    host: 'Host'
-    port: 'Port'
-    username: 'Username'
-    password: 'Password'
-
-  mediaplayerset: 
-    title: 'Media Player Setting'
-    type: 'type'
-    url: 'url'
-
-  cancel: 'Cancel'
-  apply: 'Apply'
-  
--- a/webui/src/locales/lang/zh-CN.json
+++ b/webui/src/locales/lang/zh-CN.json
@@ -0,0 +1,132 @@
+{
+  "login": {
+    "title": "登录",
+    "username": "用户名",
+    "password": "密码",
+    "loginbtn": "登录",
+    "default": "默认账号密码 "
+  },
+  "sidebar": {
+    "title": "菜单",
+    "homepage": "主页",
+    "player": "播放器",
+    "log": "日志",
+    "config": "设置",
+    "logout": "退出",
+    "calendar": "日历",
+    "downloader": "下载器"
+  },
+  "topbar": {
+    "start": "启动",
+    "pause": "暂停",
+    "restart": "重启",
+    "shutdown": "关闭",
+    "resetrule": "重置规则",
+    "profile": {
+      "title": "账户资料",
+      "poptitle": "修改账户信息",
+      "username": "用户名",
+      "password": "密码",
+      "updatebtn": "更新"
+    },
+    "add": {
+      "title": "添加番剧",
+      "rsslink": "RSS链接",
+      "placeholder": "请输入RSS链接",
+      "analyse": "分析"
+    }
+  },
+  "homepage": {
+    "title": "番剧列表",
+    "rule": {
+      "officaltitle": "官方名称",
+      "year": "年份",
+      "season": "季度",
+      "offset": "偏移",
+      "exclude": "排除",
+      "enable": "启用",
+      "disable": "禁用",
+      "delete": "删除",
+      "apply": "应用",
+      "yesbtn": "是",
+      "nobtn": "否",
+      "enablehit": "确定要让规则生效吗？",
+      "deletehit": "删除本地文件？",
+      "enablerule": "启用规则",
+      "editrule": "编辑规则"
+    }
+  },
+  "player": {
+    "title": "播放器",
+    "hit": "请设置播放器地址"
+  },
+  "log": {
+    "title": "日志",
+    "reset": "重置",
+    "copy": "复制",
+    "contactinfo": "联系方式",
+    "go": "访问",
+    "join": "加入",
+    "bugrepo": "Bug反馈"
+  },
+  "config": {
+    "title": "系统设置",
+    "normalset": {
+      "title": "一般设置",
+      "rssintvl": "RSS间隔",
+      "renameintvl": "重命名间隔",
+      "webport": "网页端口",
+      "debug": "调试"
+    },
+    "parserset": {
+      "title": "解析设置",
+      "enable": "启用",
+      "source": "数据源",
+      "token": "Token",
+      "url": "自定义网址",
+      "language": "语言",
+      "type": "解析类型",
+      "exclude": "排除"
+    },
+    "downloaderset": {
+      "title": "下载设置",
+      "type": "下载器类型",
+      "host": "下载器地址",
+      "username": "用户名",
+      "password": "密码",
+      "path": "下载地址",
+      "ssl": "SSL"
+    },
+    "manageset": {
+      "title": "番剧管理设置",
+      "enable": "启用",
+      "method": "重命名方式",
+      "eps": "EPS完成",
+      "grouptag": "添加组标签",
+      "deletebadtorr": "删除坏种"
+    },
+    "notificationset": {
+      "title": "推送设置",
+      "enable": "启用",
+      "type": "类型",
+      "token": "Token",
+      "chatid": "Chat ID"
+    },
+    "proxyset": {
+      "title": "代理设置",
+      "enable": "启用",
+      "type": "类型",
+      "host": "地址",
+      "port": "端口",
+      "username": "用户名",
+      "password": "密码"
+    },
+    "mediaplayerset": {
+      "title": "播放器设置",
+      "type": "类型",
+      "url": "播放器地址"
+    },
+    "cancel": "取消",
+    "apply": "应用"
+  }
+}
--- a/webui/src/locales/lang/zh-CN.yaml
+++ b/webui/src/locales/lang/zh-CN.yaml
@@ -1,126 +0,0 @@
-login:
-  title: '登录'
-  username: '用户名'
-  password: '密码'
-  loginbtn: '登录'
-  default: '默认账号密码 '
-
-sidebar:
-  title: '菜单'
-  homepage: '主页'
-  player: '播放器'
-  log: '日志'
-  config: '设置'
-  logout: '退出'
-
-topbar:
-  start: '启动'
-  pause: '暂停'
-  restart: '重启'
-  shutdown: '关闭'
-  resetrule: '重置规则'
-
-  profile: 
-    title: '账户资料'
-    poptitle: '修改账户信息'
-    username: '用户名'
-    password: '密码'
-    updatebtn: '更新'
-
-  add:
-    title: '添加番剧'
-    rsslink: 'RSS链接'
-    placeholder: '请输入RSS链接'
-    analyse: '分析'
-
-homepage:
-  title: '番剧列表'
-  rule: 
-    officaltitle: '官方名称'
-    year: '年份'
-    season: '季度'
-    offset: '偏移'
-    exclude: '排除'
-    enable: '启用'
-    disable: '禁用'
-    delete: '删除'
-    apply: '应用'
-    yesbtn: '是'
-    nobtn: '否'
-    enablehit: '确定要让规则生效吗？'
-    deletehit: '删除本地文件？'
-    enablerule: '启用规则'
-    editrule: '编辑规则'
-
-player:
-  title: '播放器'
-  hit: '请设置播放器地址'
-
-log:
-  title: '日志'
-  reset: '重置'
-  copy: '复制'
-  contactinfo: '联系方式'
-  go: '访问'
-  join: '加入'
-  bugrepo: 'Bug反馈'
-
-config:
-  title: '系统设置'
-  normalset: 
-    title: '一般设置'
-    rssintvl: 'RSS间隔'
-    renameintvl: '重命名间隔'
-    webport: '网页端口'
-    debug: '调试'
-
-  parserset: 
-    title: '解析设置'
-    enable: '启用'
-    source: '数据源'
-    token: 'Token'
-    url: '自定义网址'
-    language: '语言'
-    type: '解析类型'
-    exclude: '排除'
-
-  downloaderset: 
-    title: '下载设置'
-    type: '下载器类型'
-    host: '下载器地址'
-    username: '用户名'
-    password: '密码'
-    path: '下载地址'
-    ssl: 'SSL'
-  
-  manageset: 
-    title: '番剧管理设置'
-    enable: '启用'
-    method: '重命名方式'
-    eps: 'EPS完成'
-    grouptag: '添加组标签'
-    deletebadtorr: '删除坏种'
-
-  notificationset: 
-    title: '推送设置'
-    enable: '启用'
-    type: '类型'
-    token: 'Token'
-    chatid: 'Chat ID'
-
-  proxyset: 
-    title: '代理设置'
-    enable: '启用'
-    type: '类型'
-    host: '地址'
-    port: '端口'
-    username: '用户名'
-    password: '密码'
-
-  mediaplayerset: 
-    title: '播放器设置'
-    type: '类型'
-    url: '播放器地址'
-
-  cancel: '取消'
-  apply: '应用'
--- a/webui/src/pages/index.vue
+++ b/webui/src/pages/index.vue
@@ -13,12 +13,11 @@ definePage({
      <ab-sidebar />

      <div layout-content>
-
-          <RouterView v-slot="{ Component }">
-            <KeepAlive>
-              <component :is="Component" />
-            </KeepAlive>
-          </RouterView>
+        <RouterView v-slot="{ Component }">
+          <KeepAlive>
+            <component :is="Component" />
+          </KeepAlive>
+        </RouterView>
      </div>
    </main>
  </div>
--- a/webui/src/pages/index/bangumi.vue
+++ b/webui/src/pages/index/bangumi.vue
@@ -105,7 +105,7 @@ definePage({
        :season="i.season"
        @click="() => open(i)"
      ></ab-bangumi-card>
-  
+
      <ab-edit-rule
        v-model:show="editRule.show"
        v-model:rule="editRule.item"
--- a/webui/src/pages/index/config.vue
+++ b/webui/src/pages/index/config.vue
@@ -15,26 +15,28 @@ definePage({
      <div grid="~ cols-2" gap-20px mb-auto>
        <div space-y-20px>
          <config-normal></config-normal>
-  
+
          <config-parser></config-parser>
-  
+
          <config-download></config-download>
-  
+
          <config-manage></config-manage>
        </div>
-  
+
        <div space-y-20px>
          <config-notification></config-notification>
-  
+
          <config-proxy></config-proxy>
-  
+
          <config-player></config-player>
        </div>
      </div>
-  
+
      <div fx-cer justify-end gap-8px mt-20px>
-        <ab-button type="warn" @click="getConfig">{{$t('config.cancel')}}</ab-button>
-        <ab-button @click="setConfig">{{$t('config.apply')}}</ab-button>
+        <ab-button type="warn" @click="getConfig">{{
+          $t('config.cancel')
+        }}</ab-button>
+        <ab-button @click="setConfig">{{ $t('config.apply') }}</ab-button>
      </div>
    </div>
  </div>
--- a/webui/src/pages/index/log.vue
+++ b/webui/src/pages/index/log.vue
@@ -29,13 +29,15 @@ definePage({
        >
          <pre text-main>{{ log }}</pre>
        </div>
-  
+
        <div flex="~ justify-end" space-x-10px mt-12px>
-          <ab-button type="warn" size="small" @click="reset">{{$t('log.reset')}}</ab-button>
-          <ab-button size="small" @click="copy">{{$t('log.copy')}}</ab-button>
+          <ab-button type="warn" size="small" @click="reset">{{
+            $t('log.reset')
+          }}</ab-button>
+          <ab-button size="small" @click="copy">{{ $t('log.copy') }}</ab-button>
        </div>
      </ab-container>
-  
+
      <div grow w-500px space-y-20px>
        <ab-container :title="$t('log.contactinfo')">
          <div space-y-12px>
@@ -45,44 +47,44 @@ definePage({
                link="https://github.com/EstrellaXD/Auto_Bangumi"
                target="_blank"
              >
-              {{$t('log.go')}}
+                {{ $t('log.go') }}
              </ab-button>
            </ab-label>
-  
+
            <ab-label label="WebUI Repo">
              <ab-button
                size="small"
                link="https://github.com/Rewrite0/Auto_Bangumi_WebUI"
                target="_blank"
              >
-              {{$t('log.go')}}
+                {{ $t('log.go') }}
              </ab-button>
            </ab-label>
-  
+
            <div line></div>
-  
+
            <ab-label label="Twitter">
              <ab-button
                size="small"
                link="https://twitter.com/Estrella_Pan"
                target="_blank"
              >
-              {{$t('log.go')}}
+                {{ $t('log.go') }}
              </ab-button>
            </ab-label>
-  
+
            <ab-label label="Telegram Group">
              <ab-button
                size="small"
                link="https://t.me/autobangumi"
                target="_blank"
              >
-              {{$t('log.join')}}
+                {{ $t('log.join') }}
              </ab-button>
            </ab-label>
          </div>
        </ab-container>
-  
+
        <ab-container :title="$t('log.bugrepo')">
          <div space-y-12px>
            <ab-button
@@ -94,9 +96,9 @@ definePage({
              link="https://github.com/EstrellaXD/Auto_Bangumi/issues"
              >Github Issue</ab-button
            >
-  
+
            <div line></div>
-  
+
            <ab-button
              mx-auto
              text-16px
--- a/webui/src/pages/index/player.vue
+++ b/webui/src/pages/index/player.vue
@@ -11,11 +11,11 @@ const { url } = storeToRefs(usePlayerStore());
  <div overflow-auto mt-12px flex-grow>
    <template v-if="url === ''">
      <div wh-full f-cer text-h1 text-primary>
-        <RouterLink to="/config" hover:underline
-          >{{ $t('player.hit')}}</RouterLink
-        >
+        <RouterLink to="/config" hover:underline>{{
+          $t('player.hit')
+        }}</RouterLink>
      </div>
-    </template>    
+    </template>
    <iframe
      v-else
      :src="url"
--- a/webui/src/pages/login.vue
+++ b/webui/src/pages/login.vue
@@ -32,13 +32,15 @@ definePage({
        <div line></div>

        <div flex="~ justify-end">
-          <ab-button size="small" @click="login">{{$t('login.loginbtn')}}</ab-button>
+          <ab-button size="small" @click="login">{{
+            $t('login.loginbtn')
+          }}</ab-button>
        </div>
      </div>
    </ab-container>

    <div bg="#C7C4AB" text-white rounded-4px py-4px px-2em text-main>
-      <div>{{$t('login.default')}}: admin adminadmin</div>
+      <div>{{ $t('login.default') }}: admin adminadmin</div>
    </div>
  </div>
 </template>
--- a/webui/vite.config.ts
+++ b/webui/vite.config.ts
@@ -6,8 +6,6 @@ import AutoImport from 'unplugin-auto-import/vite';
 import Components from 'unplugin-vue-components/vite';
 import VueRouter from 'unplugin-vue-router/vite';
 import { VueRouterAutoImports } from 'unplugin-vue-router';
-import vueI18n from '@intlify/unplugin-vue-i18n/vite';
-import path from 'path'

 // https://vitejs.dev/config/
 export default defineConfig({
@@ -36,9 +34,6 @@ export default defineConfig({
        'src/components/setting',
      ],
    }),
-    vueI18n({
-        include: path.resolve(__dirname, './src/locales/lang/**')
-    }),
  ],
  css: {
    preprocessorOptions: {