fix(i18n): load language files before doing anything else #3218
54
src/main.ts
54
src/main.ts
|
@ -39,41 +39,44 @@ if (window.API_URL.slice(window.API_URL.length - 1, window.API_URL.length) === '
|
|||
window.API_URL = window.API_URL.slice(0, window.API_URL.length - 1)
|
||||
}
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
|
||||
app.use(Notifications)
|
||||
|
||||
// directives
|
||||
import focus from '@/directives/focus'
|
||||
import { VTooltip } from 'floating-vue'
|
||||
import {VTooltip} from 'floating-vue'
|
||||
import 'floating-vue/dist/style.css'
|
||||
import shortcut from '@/directives/shortcut'
|
||||
import cypress from '@/directives/cypress'
|
||||
|
||||
app.directive('focus', focus)
|
||||
app.directive('tooltip', VTooltip)
|
||||
app.directive('shortcut', shortcut)
|
||||
app.directive('cy', cypress)
|
||||
|
||||
// global components
|
||||
import FontAwesomeIcon from '@/components/misc/Icon'
|
||||
import Button from '@/components/input/button.vue'
|
||||
import Modal from '@/components/misc/modal.vue'
|
||||
import Card from '@/components/misc/card.vue'
|
||||
|
||||
app.component('icon', FontAwesomeIcon)
|
||||
app.component('x-button', Button)
|
||||
app.component('modal', Modal)
|
||||
app.component('card', Card)
|
||||
// We're loading the language before creating the app so that it won't fail to load when the user's
|
||||
// language file is not yet loaded.
|
||||
setLanguage().then(() => {
|
||||
const app = createApp(App)
|
||||
|
||||
app.config.errorHandler = (err, vm, info) => {
|
||||
app.use(Notifications)
|
||||
|
||||
app.directive('focus', focus)
|
||||
app.directive('tooltip', VTooltip)
|
||||
app.directive('shortcut', shortcut)
|
||||
app.directive('cy', cypress)
|
||||
|
||||
app.component('icon', FontAwesomeIcon)
|
||||
app.component('x-button', Button)
|
||||
app.component('modal', Modal)
|
||||
app.component('card', Card)
|
||||
|
||||
app.config.errorHandler = (err, vm, info) => {
|
||||
if (import.meta.env.DEV) {
|
||||
console.error(err, vm, info)
|
||||
}
|
||||
error(err)
|
||||
}
|
||||
}
|
||||
|
||||
if (import.meta.env.DEV) {
|
||||
if (import.meta.env.DEV) {
|
||||
app.config.warnHandler = (msg) => {
|
||||
error(msg)
|
||||
throw(msg)
|
||||
|
@ -92,21 +95,20 @@ if (import.meta.env.DEV) {
|
|||
error(err)
|
||||
throw err
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
app.config.globalProperties.$message = {
|
||||
app.config.globalProperties.$message = {
|
||||
error,
|
||||
success,
|
||||
}
|
||||
}
|
||||
|
||||
if (window.SENTRY_ENABLED) {
|
||||
if (window.SENTRY_ENABLED) {
|
||||
import('./sentry').then(sentry => sentry.default(app, router))
|
||||
}
|
||||
}
|
||||
|
||||
app.use(pinia)
|
||||
app.use(router)
|
||||
app.use(i18n)
|
||||
app.use(pinia)
|
||||
app.use(router)
|
||||
app.use(i18n)
|
||||
|
||||
setLanguage().then(() => {
|
||||
app.mount('#app')
|
||||
})
|
Reference in New Issue
Block a user
Would it work if we save the returned promise of
setLanguage
and load it in parallel to all the stuff until mounting the app?That's how it is done right now, but that does not seem to work.
It looks like the language needs to be loaded before the Vue Lifecycle starts.
Actually tried it again but even got an error here
TypeError: route is undefined
.That's weird. I just tried this myself and couldn't trigger that error.