So I am getting this warning in nuxt3:
Calling useRoute within middleware may lead to misleading results. Instead, use the (to, from) arguments passed to the middleware to access the new and old routes.
This happens because I am calling useLocalePath()
in my middleware.
This is one of the middleware where it happens:
export default defineNuxtRouteMiddleware(async(to, from) => {
const localPath = useLocalePath()
const isUserAuthenticated = await isAuthenticated()
if (isUserAuthenticated) {
if (to.fullPath === localPath('login') || to.fullPath === localPath('register')) {
return navigateTo(localPath('/'))
}
} else {
if (to.fullPath !== localPath('login') && to.fullPath !== localPath('register')) {
return navigateTo(localPath('login'))
}
}
})
I have this in my nuxt.config.ts:
i18n: {
lazy: true,
langDir: "locales",
strategy: "prefix_and_default",
locales: [
{
code: 'nl-Nl',
iso: 'nl-Nl',
name: 'Dutch',
file: 'nl-NL.json'
},
{
code: 'en',
iso: 'en',
name: 'English',
file: 'en.json'
},
],
detectBrowserLanguage: {
useCookie: true,
cookieCrossOrigin: true,
alwaysRedirect: true,
cookieKey: 'i18n_redirected',
redirectOn: 'root'
},
defaultLocale: "nl-Nl",
customRoutes: 'config',
pages: {
pricing: {
en: '/pricing',
'nl-Nl': '/prijzen',
}
}
}
This is the version of i18n that i’m using:
"@nuxtjs/i18n": "^8.0.0-beta.12",
The thing is, the code is working perfectly fine, but I don’t have any clue why it’s giving me this warning.
Is it safe to ignore this warning?
2
Answers
This works for me
useLocalePath()
uses theuseRoute()
method under the hood that’s why you are getting that warn. one solution could be to useuseI18n()
instead and accesing the App locale variable.