zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

feat: render app shell with ssr to improve loading experience (#448)

Browse source
This commit is contained in:
Daniel Roe 2022-12-17 16:55:29 +00:00 • committed by GitHub
parent b545efeacc
commit 9395b7031e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
35 changed files with 169 additions and 127 deletions
Download patch file Download diff file Expand all files Collapse all files

29
composables/setups.ts
View file

@ -19,22 +19,25 @@ export function setupPageHeader() {
export async function setupI18n() {
const { locale, setLocale, locales } = useI18n()
const isFirstVisit = !window.localStorage.getItem(STORAGE_KEY_LANG)
const localeStorage = useLocalStorage(STORAGE_KEY_LANG, locale.value)
const nuxtApp = useNuxtApp()
nuxtApp.hook('app:suspense:resolve', async () => {
const isFirstVisit = process.server ? false : !window.localStorage.getItem(STORAGE_KEY_LANG)
const localeStorage = process.server ? ref('en-US') : useLocalStorage(STORAGE_KEY_LANG, locale.value)
if (isFirstVisit) {
const userLang = (navigator.language || 'en-US').toLowerCase()
// cause vue-i18n not explicit export LocaleObject type
const supportLocales = unref(locales) as { code: string }[]
const lang = supportLocales.find(locale => userLang.startsWith(locale.code.toLowerCase()))?.code
if (isFirstVisit) {
const userLang = (navigator.language || 'en-US').toLowerCase()
// cause vue-i18n not explicit export LocaleObject type
const supportLocales = unref(locales) as { code: string }[]
const lang = supportLocales.find(locale => userLang.startsWith(locale.code.toLowerCase()))?.code
|| supportLocales.find(locale => userLang.startsWith(locale.code.split('-')[0]))?.code
localeStorage.value = lang || 'en-US'
}
localeStorage.value = lang || 'en-US'
}
if (localeStorage.value !== locale.value)
await setLocale(localeStorage.value)
if (localeStorage.value !== locale.value)
await setLocale(localeStorage.value)
watchEffect(() => {
localeStorage.value = locale.value
watchEffect(() => {
localeStorage.value = locale.value
})
})
}