如何使用 next.js 和 next-i18next 本地化路线? [英] How do I localize routes with next.js and next-i18next?
问题描述
更改语言时需要更改路线名称.例如,我有一个路线 /en/career
,但是当我更改为捷克语时,我需要一个路线 /cs/kariera
.基本上我需要对 URL 进行本地化.现在,当我使用 /en/career
并将语言更改为 cs 时,我会得到 /cs/career
.这个页面根本不应该存在,当我在服务器上渲染页面时,我正确地得到 404.我可以用 next-i18next 包做这样的事情吗?如果有,怎么做?
I need to change the name of the route when I change the language. For example, I have a route /en/career
but when I change to Czech language, I need a route /cs/kariera
. Basically I need the URLs to be localized. Right now, when I'm on /en/career
and change language to cs, I get /cs/career
. This page should not exist at all and when I render the page on server, I correctly get 404. Can I do something like this with next-i18next package? If so, how?
我找到了这个包 https://github.com/vonschau/next-routes-with-locale 这可能正是我需要的,但它显然不再维护并且在 next.js 8 下不起作用.
I found this package https://github.com/vonschau/next-routes-with-locale which probably does exactly what I need but it's apparently no longer maintained and doesn't work under next.js 8.
推荐答案
我最终做的是使用 next-routes
包并为每个页面定义了特定的路由,例如:
What I did eventually was to use next-routes
package and defined specific route for every page, such as:
module.exports = routes()
.add('en-career-listing', '/en/career/:listing', 'career/listing')
.add('cs-career-listing', '/cs/kariera/:listing', 'career/listing')
.add('en-career', '/en/career', 'career')
.add('cs-career', '/cs/kariera', 'career')
.add('en-our-story', '/en/our-story', 'our-story')
.add('cs-our-story', '/cs/nas-pribeh', 'our-story')
我还必须基于 next/link
创建一个自定义 Link
组件,在其中我手动将语言添加到 URL.
And I also had to create a custom Link
component based on next/link
where I manually added the language to URL.
这篇关于如何使用 next.js 和 next-i18next 本地化路线?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!