如何在NextJS 15中用next-intl隐藏默认locale并兼容博客路由

问题根源 #

当你设置localePrefix:'as-needed'并修改中间件matcher为匹配所有非静态资源路径时，中间件会处理包括/blog在内的所有路径，导致博客路径被错误路由到[locale]动态路由段，从而触发404。

解决方案 #

1. 更新中间件的matcher规则 #

修改src/app/middleware.ts中的matcher，排除blog相关路径，让Next.js直接处理博客的文件系统路由：

import createMiddleware from 'next-intl/middleware'
import { routing } from './i18n/routing'

export default createMiddleware(routing)

export const config = {
  // 匹配所有非静态资源、非API、非博客的路径
  matcher: ['/((?!api|_next|_vercel|.*\\..*|blog).*)']
}

2. 保留routing.ts的localePrefix配置 #

确保src/app/i18n/routing.ts中已添加localePrefix:'as-needed'，这是隐藏默认Locale的关键配置：

import { defineRouting } from 'next-intl/routing'
import { createNavigation } from 'next-intl/navigation'
import { DEFAULT_LOCALE, SUPPORTED_LOCALES } from '../../app.config'

export const routing = defineRouting({
  locales: SUPPORTED_LOCALES,
  defaultLocale: DEFAULT_LOCALE,
  localePrefix: 'as-needed' // 保留此配置
})

export const { Link, redirect, usePathname, useRouter, getPathname } = createNavigation(routing)

3. 验证效果 #

调整后：

• 根路径domain.com默认使用默认Locale，路径无Locale前缀
• 带Locale的路径domain.com/en可正常访问国际化内容
• 博客路径domain.com/blog和domain.com/blog/xxx直接命中src/app/blog下的路由，无需经过i18n中间件，不会出现404

内容的提问来源于stack exchange，提问作者Ankit Verma