perf: 优化体积,highlight.js按需导入与i18n按需加载 (#696)

* perf: 优化打包体积,highlight.js按需导入与i18n按需加载

1. highlight.js: 从全量导入改为 core + 注册27种常用语言,减少约500~800KB
2. i18n: 只同步加载en语言包,其他8种语言改为异步加载,首屏减少约350~400KB
3. 使用vue-i18n的setLocaleMessage API动态注册语言包
4. 新增switchLocale函数统一处理语言切换
5. 同步更新相关测试文件的mock路径和API适配

* 修复类型断言
This commit is contained in:
Butter Rice Cake of Gemini
2026-05-14 12:39:36 +08:00
committed by GitHub
parent 1b4733e755
commit f6df0fecfa
8 changed files with 134 additions and 47 deletions
+25 -28
View File
@@ -1,26 +1,9 @@
import de from './locales/de'
import en from './locales/en'
import es from './locales/es'
import fr from './locales/fr'
import ja from './locales/ja'
import ko from './locales/ko'
import pt from './locales/pt'
import zh from './locales/zh'
import zhTW from './locales/zh-TW'
export type LocaleMessages = Record<string, unknown>
export type LocaleMessages = Record<string, any>
export const rawMessages = {
'en': en,
'zh': zh,
'zh-TW': zhTW,
'ja': ja,
'ko': ko,
'fr': fr,
'es': es,
'de': de,
'pt': pt,
} satisfies Record<string, LocaleMessages>
export const supportedLocales = ['en', 'zh', 'zh-TW', 'ja', 'ko', 'fr', 'es', 'de', 'pt'] as const
export type SupportedLocale = (typeof supportedLocales)[number]
function isPlainObject(value: unknown): value is LocaleMessages {
return !!value && typeof value === 'object' && !Array.isArray(value)
@@ -42,11 +25,25 @@ export function mergeMessagesWithFallback(
return merged
}
export const messages = Object.fromEntries(
Object.entries(rawMessages).map(([locale, localeMessages]) => [
locale,
locale === 'en'
? localeMessages
: mergeMessagesWithFallback(en, localeMessages),
]),
) as typeof rawMessages
const localeLoaders: Record<string, () => Promise<{ default: LocaleMessages }>> = {
'zh': () => import('./locales/zh'),
'zh-TW': () => import('./locales/zh-TW'),
'ja': () => import('./locales/ja'),
'ko': () => import('./locales/ko'),
'fr': () => import('./locales/fr'),
'es': () => import('./locales/es'),
'de': () => import('./locales/de'),
'pt': () => import('./locales/pt'),
}
export { en }
export async function loadLocale(locale: string): Promise<LocaleMessages | null> {
if (locale === 'en') return en
const loader = localeLoaders[locale]
if (!loader) return null
const mod = await loader()
return mergeMessagesWithFallback(en, mod.default)
}