frontend-web/src/i18n.js
2022-06-17 10:45:51 +02:00

68 lines
1.6 KiB
JavaScript

import { nextTick } from 'vue'
import { createI18n } from 'vue-i18n'
export const SUPPORT_LOCALES = ['en', 'de']
var default_options = {
warnHtmlInMessage: 'off',
warnHtmlMessage: false,
fallbackWarn: false,
silentTranslationWarn: true,
locale: 'en',
fallbackLocale: {
'de': ['en'],
'default': ['en']
}
}
export function setupI18n(options = default_options) {
const i18n = createI18n(options)
loadLocaleMessages(i18n, options.locale)
setI18nLanguage(i18n, options.locale)
return i18n
}
export function setI18nLanguage(i18n, locale) {
i18n.locale = 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(i18n, locale) {
// load locale messages with dynamic import
const messages = await import(
`./locales/${locale}.json`
)
// set locale and locale message
if ('global' in i18n) {
i18n.global.setLocaleMessage(locale, messages.default)
} else {
i18n.setLocaleMessage(locale, messages.default)
}
return nextTick()
}
export async function loadAndSetLocale (i18n, new_locale) {
// use locale if paramsLocale is not in SUPPORT_LOCALES
if (!SUPPORT_LOCALES.includes(new_locale)) {
//return next(`/${locale}`)
return
}
await loadLocaleMessages(i18n, new_locale)
// set i18n language
setI18nLanguage(i18n, new_locale)
return
}