我正在尝试让 nuxt 生成本地化的动态路由。我使用 nuxt-i18n 翻译每条路线。
这是我的 nuxt-i18n 配置:
['nuxt-i18n', {
lazy: true,
locales: [
{
name: 'French',
code: 'fr',
iso: 'fr-ch',
file: 'fr.json'
},
{
name: 'German',
code: 'de',
iso: 'de-ch',
file: 'de.json'
},
{
name: 'Italian',
code: 'it',
iso: 'it-ch',
file: 'it.json'
},
],
langDir: 'lang/',
defaultLocale: 'fr',
parsePages: false,
pages: {
'advice/_uid': {
fr: '/conseil/:uid',
de: '/ratschlag/:uid',
it: '/consiglio/:uid',
},
}
}]
如文档中所述:
generate 命令 (yarn generate) 会忽略动态路由。Nuxt 不知道这些路由将是什么,因此它无法生成它们。
因此,我尝试调整他们的示例并使用我的无头 CMS 的 Api 来重建所有路由,但不幸的是,nuxt 出于某种原因没有生成它们。我尝试使用文件结构(即/advice/_uid.vue
)而不是本地化路由,希望 nuxt-i18n 会为我解决这个问题,但那方面也没有运气。
这是我的 nuxt.config.js:
import Prismic from 'prismic-javascript'
const prismicEndpoint = 'https://some-repository.cdn.prismic.io/api/v2'
const advices = () =>
Prismic.getApi(prismicEndpoint)
.then(api =>
api.query(Prismic.Predicates.at('document.type', 'advice'), {
pageSize: 100,
})
)
.then(res => {
return [
...res.results.map(advice => `/conseil/${advice.uid}`),
]
})
// Some more code...
export default {
// Some more code...
generate: {
fallback: '404.html',
advices
}
}
我运行时没有错误npm run generate
,尽管它不会生成任何这些路由。在我使用 nuxt-i18n 本地化我的路线之前,它曾经工作得很好
有没有办法让 nuxt 或 nuxt-i18n 生成本地化的动态路线?
谢谢你的帮助!