Next.js中[lang]文件夹下默认路由重定向404问题求助

你遇到的核心问题是根路径/没有对应的页面组件——因为你把原本的layout.tsx和page.tsx都移到了[lang]动态路由文件夹下，所以首次访问/时会触发404。以下两种方案可以在保留[lang]结构的同时，实现到/en/bootcamps的强制重定向：

方案1：根目录添加重定向页面 #

在项目根目录（和[lang]文件夹同级）新建page.tsx，直接通过Next.js的redirect函数完成跳转：

// /page.tsx
import { redirect } from 'next/navigation';

export default function RootRedirectPage() {
  redirect('/en/bootcamps');
}

这个组件会在用户访问/时立即触发重定向，完全不影响[lang]路由下的其他功能，也能正常获取locale参数。

方案2：用全局中间件处理（更灵活） #

如果后续需要根据用户语言偏好调整重定向目标，或者要对更多路径做处理，可以在项目根目录新建middleware.ts：

// /middleware.ts
import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';

export function middleware(request: NextRequest) {
  // 仅针对根路径触发重定向
  if (request.nextUrl.pathname === '/') {
    return NextResponse.redirect(new URL('/en/bootcamps', request.url));
  }
}

// 配置中间件的触发路径，只匹配根路径
export const config = {
  matcher: '/',
};

这种方式不需要额外的页面组件，直接在请求层面完成跳转，适合更复杂的路由规则场景。

两种方案都能解决首次访问的404问题，同时保留[lang]文件夹的结构，不影响page.tsx中locale参数的获取。

内容的提问来源于stack exchange，提问作者Konul Memmedova