index.ts 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
  2. import type { App } from 'vue';
  3. import { ref } from 'vue';
  4. import { $t, setupI18n as coreSetup, loadLocalesMap } from '@vben/locales';
  5. import { preferences } from '@vben/preferences';
  6. import dayjs from 'dayjs';
  7. import { Language } from 'element-plus/es/locale';
  8. import enLocale from 'element-plus/es/locale/lang/en';
  9. import defaultLocale from 'element-plus/es/locale/lang/zh-cn';
  10. const elementLocale = ref<Language>(defaultLocale);
  11. const modules = import.meta.glob('./langs/*.json');
  12. const localesMap = loadLocalesMap(modules);
  13. /**
  14. * 加载应用特有的语言包
  15. * 这里也可以改造为从服务端获取翻译数据
  16. * @param lang
  17. */
  18. async function loadMessages(lang: SupportedLanguagesType) {
  19. const [appLocaleMessages] = await Promise.all([
  20. localesMap[lang](),
  21. loadThirdPartyMessage(lang),
  22. ]);
  23. return appLocaleMessages.default;
  24. }
  25. /**
  26. * 加载第三方组件库的语言包
  27. * @param lang
  28. */
  29. async function loadThirdPartyMessage(lang: SupportedLanguagesType) {
  30. await Promise.all([loadElementLocale(lang), loadDayjsLocale(lang)]);
  31. }
  32. /**
  33. * 加载dayjs的语言包
  34. * @param lang
  35. */
  36. async function loadDayjsLocale(lang: SupportedLanguagesType) {
  37. let locale;
  38. switch (lang) {
  39. case 'zh-CN': {
  40. locale = await import('dayjs/locale/zh-cn');
  41. break;
  42. }
  43. case 'en-US': {
  44. locale = await import('dayjs/locale/en');
  45. break;
  46. }
  47. // 默认使用英语
  48. default: {
  49. locale = await import('dayjs/locale/en');
  50. }
  51. }
  52. dayjs.locale(locale);
  53. }
  54. /**
  55. * 加载element-plus的语言包
  56. * @param lang
  57. */
  58. async function loadElementLocale(lang: SupportedLanguagesType) {
  59. switch (lang) {
  60. case 'zh-CN': {
  61. elementLocale.value = defaultLocale;
  62. break;
  63. }
  64. case 'en-US': {
  65. elementLocale.value = enLocale;
  66. break;
  67. }
  68. }
  69. }
  70. async function setupI18n(app: App, options: LocaleSetupOptions = {}) {
  71. await coreSetup(app, {
  72. defaultLocale: preferences.app.locale,
  73. loadMessages,
  74. missingWarn: !import.meta.env.PROD,
  75. ...options,
  76. });
  77. }
  78. export { $t, elementLocale, loadMessages, setupI18n };