I am working on an international blog in nuxt. I cant seem to access the i18n object in the nav component and on some pages. Can you clarify how to access it and why I cant? I am assuming it is lifecycle related but not sure...
In nuxt-config.js:
...
modules: [
'nuxt-i18n',
'@nuxt/content'
],
i18n:{
strategy: 'prefix_and_default',
defaultLocale: 'en',
langDir: 'lang/',
lazy: true,
locales: [
{
name: '日本語',
code: 'ja',
iso: 'ja-JP',
file: 'ja-JP.js'
},
{
name: 'English',
code: 'en',
iso: 'en-US',
file: 'en-US.js'
},
],
detectBrowserLanguage: {
// If enabled, a cookie is set once a user has been redirected to his
// preferred language to prevent subsequent redirections
// Set to false to redirect every time
useCookie: true,
// Set to override the default domain of the cookie. Defaults to host of the site.
cookieDomain: null,
// Cookie name
cookieKey: 'i18n_redirected',
// Set to always redirect to value stored in the cookie, not just once
alwaysRedirect: false,
// If no locale for the browsers locale is a match, use this one as a fallback
}
},
...
I am trying to bring in different markdown files depending on the language so I am calling:
export default {
async asyncData({ $content, params}) {
const data = await $content(`${i18n.locale}/data`, params.slug).fetch()
return { data }
},
in content I have en/data/... and ja/data/... and it works if I hard code it as en/data/ or ja/data but I get i18n is undefined errors, I have tried several patterns but with no success.
