yf-portal-vue/src/i18n/index.ts

import { createI18n, useI18n } from "vue-i18n";
import zh from "./lang/zh.json";
import en from "./lang/en.json";
import ru from "./lang/ru.json";

export const LOCALE_STORAGE_KEY = "yf-portal-locale";
export const SUPPORTED_LOCALES = ["zh", "en", "ru"] as const;
export type AppLocale = (typeof SUPPORTED_LOCALES)[number];

const messages = {
  zh,
  en,
  ru,
};

const resolveBrowserLocale = (browserRaw: string): AppLocale => {
  const browserLocale = browserRaw.toLowerCase();

  if (browserLocale.startsWith("zh")) {
    return "zh";
  }

  if (browserLocale.startsWith("ru")) {
    return "ru";
  }

  if (browserLocale.startsWith("en")) {
    return "en";
  }

  return "zh";
};

const getDefaultLocale = (): AppLocale => {
  if (typeof window === "undefined") {
    return "zh";
  }

  const savedLocale = localStorage.getItem(LOCALE_STORAGE_KEY);
  if (savedLocale && SUPPORTED_LOCALES.includes(savedLocale as AppLocale)) {
    return savedLocale as AppLocale;
  }

  const browserRaw = navigator.language;
  return resolveBrowserLocale(browserRaw);
};

const locale = getDefaultLocale();

if (typeof document !== "undefined") {
  document.documentElement.lang = locale;
}

const i18n = createI18n({
  legacy: false,
  locale,
  fallbackLocale: "en",
  messages,
});

export { i18n, useI18n };