feat: update dependencies and use petite-vue-i18n

package.json

@@ -14,12 +14,13 @@
   },
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.1",
-    "@intlify/unplugin-vue-i18n": "^4.0.0",
-    "@vitejs/plugin-vue": "^5.1.4",
-    "@vueuse/core": "^11.1.0",
-    "comlink": "^4.4.1",
+    "@intlify/core-base": "^11.0.0-rc.1",
+    "@intlify/unplugin-vue-i18n": "^6.0.2",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "@vueuse/core": "^12.1.0",
+    "comlink": "^4.4.2",
     "detect-browser": "^5.3.0",
-    "element-plus": "^2.8.4",
+    "element-plus": "^2.9.1",
     "eventemitter3": "^5.0.1",
     "file-saver": "^2.0.5",
     "jquery": "^3.7.1",
@@ -31,40 +32,40 @@
     "md5": "^2.3.0",
     "nano-jsx": "^0.1.0",
     "noty": "3.1.4",
+    "petite-vue-i18n": "^10.0.5",
     "streamsaver": "^2.0.6",
-    "vue": "^3.5.11",
-    "vue-i18n": "^9.14.1"
+    "vue": "^3.5.13"
   },
   "devDependencies": {
-    "@commitlint/cli": "^19.5.0",
-    "@commitlint/config-conventional": "^19.5.0",
+    "@commitlint/cli": "^19.6.1",
+    "@commitlint/config-conventional": "^19.6.0",
     "@tsuk1ko/postversion": "^1.0.2",
     "@types/clean-css": "^4.2.11",
     "@types/file-saver": "^2.0.7",
-    "@types/jquery": "^3.5.31",
+    "@types/jquery": "^3.5.32",
     "@types/jquery.pjax": "^0.0.35",
     "@types/lodash-es": "^4.17.12",
     "@types/md5": "^2.3.5",
-    "@types/node": "^20.16.10",
+    "@types/node": "^20.17.10",
     "@types/streamsaver": "^2.0.5",
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
     "eslint": "^8.57.0",
     "eslint-config-love": "^47.0.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-import-resolver-typescript": "^3.6.3",
+    "eslint-import-resolver-typescript": "^3.7.0",
     "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-n": "^17.10.3",
-    "eslint-plugin-promise": "^7.1.0",
-    "eslint-plugin-vue": "^9.28.0",
-    "less": "^4.2.0",
-    "lint-staged": "^15.2.10",
-    "prettier": "^3.3.3",
+    "eslint-plugin-n": "^17.15.1",
+    "eslint-plugin-promise": "^7.2.1",
+    "eslint-plugin-vue": "^9.32.0",
+    "less": "^4.2.1",
+    "lint-staged": "^15.2.11",
+    "prettier": "^3.4.2",
     "rollup-plugin-copy": "^3.5.0",
-    "typescript": "^5.6.2",
-    "vite": "^5.4.8",
-    "vite-plugin-monkey": "^4.0.6",
-    "vue-tsc": "^2.1.6",
+    "typescript": "^5.7.2",
+    "vite": "^6.0.5",
+    "vite-plugin-monkey": "^5.0.3",
+    "vue-tsc": "^2.1.10",
     "yorkie": "^2.0.0"
   },
   "gitHooks": {

src/app/GalleryMiniPopover.vue

@@ -107,7 +107,7 @@ import {
 } from 'element-plus';
 import { CloseBold } from '@element-plus/icons-vue';
 import { groupBy, map } from 'lodash-es';
-import { useI18n } from 'vue-i18n';
+import { useI18n } from 'petite-vue-i18n';
 import {
   NHentaiImgExt,
   type NHentaiTag,

src/app/SettingsDialog.vue

@@ -267,7 +267,9 @@
       <p class="no-sl">
         {{
           t('setting.history.downloadedNumberTip', {
-            num: Number.isNaN(downloadedNum) ? downloadedNum : n(downloadedNum),
+            num: Number.isNaN(downloadedNum)
+              ? downloadedNum
+              : numberFormatter.format(downloadedNum),
           })
         }}
       </p>
@@ -319,7 +321,7 @@ import {
   ElText,
 } from 'element-plus';
 import { Delete, Download, Upload } from '@element-plus/icons-vue';
-import { useI18n } from 'vue-i18n';
+import { useI18n } from 'petite-vue-i18n';
 import ConfirmPopup from '@/components/ConfirmPopup.vue';
 import {
   DISABLE_STREAM_DOWNLOAD,
@@ -340,6 +342,7 @@ import {
 import { pickAndReadFile } from '@/utils/file';
 import { showMessage } from '@/utils/elementPlus';
 import { IS_NHENTAI } from '@/const';
+import { numberFormatter } from '@/utils/formatter';
 
 startWatchSettings();
 
@@ -359,7 +362,7 @@ const compressionLevelMarks: ElMarks = {
   9: '9',
 };
 
-const { t, n, locale } = useI18n();
+const { t, locale } = useI18n();
 
 const show = ref(false);
 const downloadedNum = ref(NaN);
@@ -482,6 +485,9 @@ defineExpose({ open });
 #nhentai-helper-setting-dialog-outside {
   width: 80%;
   max-width: 800px;
+  .no-sl {
+    user-select: none;
+  }
 }
 
 #nhentai-helper-setting-dialog {
@@ -529,7 +535,6 @@ defineExpose({ open });
   .m-b-32 {
     margin-bottom: 32px;
   }
-  .no-sl,
   .el-form-item__label {
     user-select: none;
   }

src/components/ConfirmPopup.vue

@@ -14,7 +14,7 @@
 
 <script setup lang="ts">
 import { ElPopconfirm } from 'element-plus';
-import { useI18n } from 'vue-i18n';
+import { useI18n } from 'petite-vue-i18n';
 
 const emit = defineEmits(['confirm']);
 const { t } = useI18n();

src/i18n/index.ts

@@ -1,14 +1,17 @@
-import { createI18n } from 'vue-i18n';
+import { createI18n, registerMessageResolver } from 'petite-vue-i18n';
+import { resolveValue } from '@intlify/core-base';
 import en from './locales/en';
 import zh from './locales/zh';
 import { settings } from '@/utils/settings';
 
 type MessageSchema = typeof en;
 
-declare module 'vue-i18n' {
+declare module 'petite-vue-i18n' {
   export interface DefineLocaleMessage extends MessageSchema {}
 }
 
+registerMessageResolver(resolveValue);
+
 export const i18n = createI18n<[MessageSchema], 'en' | 'zh'>({
   legacy: false,
   locale: settings.language,

src/utils/formatter.ts

@@ -8,4 +8,6 @@ export const dateTimeFormatter = new Intl.DateTimeFormat(undefined, {
   hour12: false,
 });
 
+export const numberFormatter = new Intl.NumberFormat();
+
 export const removeIllegalFilenameChars = (name: string) => name.replace(/[/\\:*?"<>|]/g, '');

src/utils/request.ts

@@ -1,4 +1,4 @@
-import type { GmXhrRequest } from '$';
+import type { GmXmlhttpRequestOption } from '$';
 import { GM_xmlhttpRequest } from '$';
 import logger from './logger';
 
@@ -26,7 +26,7 @@ export const request = <T extends GmResponseType = 'text'>(params: {
   responseType?: T;
   retry?: number;
   /** Return `true` when there are available hosts */
-  on404?: (...args: Parameters<NonNullable<GmXhrRequest<any, T>['onload']>>) => boolean;
+  on404?: (...args: Parameters<NonNullable<GmXmlhttpRequestOption<any, T>['onload']>>) => boolean;
 }): { abort: () => void; dataPromise: Promise<GmResponseTypeMap[T]> } => {
   const { url: urlGetter, responseType, retry = 3, on404 } = params;
   let abortFunc: (() => void) | undefined;

src/vite-env.d.ts

@@ -14,9 +14,7 @@ declare module '*?worker-dev' {
 }
 
 declare module '$' {
-  import type { MonkeyWindow } from 'vite-plugin-monkey/dist/client';
   export * from 'vite-plugin-monkey/dist/client';
-  export const monkeyWindow: MonkeyWindow & GlobalThis;
 }
 
 declare interface Window extends GlobalThis {

vite.config.ts

@@ -5,7 +5,6 @@ import vue from '@vitejs/plugin-vue';
 import monkey, { cdn, util } from 'vite-plugin-monkey';
 import copy from 'rollup-plugin-copy';
 import vueI18nPlugin from '@intlify/unplugin-vue-i18n/vite';
-import workerDevLoader from './plugins/workerDevLoader';
 
 // https://vitejs.dev/config/
 export default defineConfig(async ({ mode }) => ({
@@ -24,9 +23,9 @@ export default defineConfig(async ({ mode }) => ({
     },
   },
   plugins: [
-    workerDevLoader(),
     vue(),
     vueI18nPlugin({
+      module: 'petite-vue-i18n',
       include: resolve(dirname(fileURLToPath(import.meta.url)), './src/i18n/locales/**'),
       strictMessage: false,
     }),