46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import type { AvailableLanguages } from "@/stores/user";
|
|
import dayjs from "dayjs";
|
|
import { nextTick } from "vue";
|
|
import { createI18n } from "vue-i18n";
|
|
|
|
// https://vue-i18n.intlify.dev/guide/advanced/lazy.html
|
|
export const SUPPORT_LOCALES: AvailableLanguages[] = ["de", "fr"];
|
|
let i18n: any = null;
|
|
|
|
export function setupI18n(
|
|
options = { locale: "de", legacy: false, fallbackLocale: "de" }
|
|
) {
|
|
i18n = createI18n(options);
|
|
setI18nLanguage(options.locale);
|
|
dayjs.locale(options.locale);
|
|
return i18n;
|
|
}
|
|
|
|
export function setI18nLanguage(locale: string) {
|
|
if (i18n.mode === "legacy") {
|
|
i18n.global.locale = locale;
|
|
} else {
|
|
i18n.global.locale.value = locale;
|
|
}
|
|
/**
|
|
* NOTE:
|
|
* If you need to specify the language setting for headers, such as the `fetch` API, set it here.
|
|
* The following is an example for axios.
|
|
*
|
|
* axios.defaults.headers.common['Accept-Language'] = locale
|
|
*/
|
|
document.querySelector("html")?.setAttribute("lang", locale);
|
|
}
|
|
|
|
export async function loadLocaleMessages(locale: any) {
|
|
// load locale messages with dynamic import
|
|
const messages = await import(
|
|
/* webpackChunkName: "locale-[request]" */ `./locales/${locale}.json`
|
|
);
|
|
|
|
// set locale and locale message
|
|
i18n.global.setLocaleMessage(locale, messages.default);
|
|
|
|
return nextTick();
|
|
}
|