Next.js默认locale生成重复路由(带/无前缀)问题咨询
问题解决:Next.js单Locale配置下出现双路由的问题
问题原因
当你在next.config.js中仅配置单个Locale(如['en'])时,Next.js的i18n路由机制会同时生成带前缀(/en/page)和不带前缀(/page)的两套路由——这是框架在单Locale场景下的特殊行为,并非与文档描述冲突(文档针对的是多Locale场景下默认Locale无前缀)。
解决方案
方案1:移除i18n配置(推荐)
如果你的项目仅需支持英文,完全不需要开启i18n路由配置。Next.js默认语言就是英文,移除i18n字段后,只会生成不带前缀的路由,彻底解决双路由问题。
方案2:保留i18n配置(适配未来多语言扩展)
若你需要保留i18n配置以便后续添加其他语言,可通过**重写(Rewrite)**替代重定向(Redirect)来处理带前缀的路由,避免无限循环:
在next.config.js中添加rewrites配置:
module.exports = { i18n: { locales: ['en'], defaultLocale: 'en', localeDetection: false, }, async rewrites() { return [ // 将带/en前缀的请求内部映射到无前缀路径 { source: '/en/:path*', destination: '/:path*', }, ]; }, };
重写是服务器内部的路径映射,不会触发浏览器跳转,因此不会出现循环问题。同时,确保你的应用内部路由(如next/link、router.push)使用无前缀的路径,或者通过locale: false参数避免生成带前缀的链接:
import Link from 'next/link'; // 正确的链接写法 <Link href="/page" locale={false}> 跳转至页面 </Link>
为什么重定向会无限循环?
你之前尝试的重定向规则会将/en/:path*跳转到/:path*,但如果应用内部的路由生成逻辑仍会输出带/en的链接(比如next-i18next默认行为),用户点击链接后会再次触发重定向,形成循环。而重写是在服务器端处理,不会改变浏览器URL,也不会触发二次跳转。
内容的提问来源于stack exchange,提问作者Matt Derrick
相关产品推荐
相关产品推荐

