Next.js 13(TS)中Link标签更新URL但无法找到登录页面求助

• 核心原因：Next.js 13的App Router路由规则要求，页面文件必须放在**对应路由名称的子目录下的page.tsx**中，而非直接在app目录下创建login.tsx。
• 修正步骤：
  1. 在app目录下新建login子文件夹
  2. 将原login.tsx移动到app/login/目录下，并重命名为page.tsx
  3. 确认Link组件写法无误，示例：

     import Link from 'next/link';
     
     // 头部组件内的跳转链接
     <Link href="/login">登录</Link>
     

• 额外验证点：
  • 确保app/login/page.tsx有正确的默认导出，比如：

    export default function LoginPage() {
      return <div>登录页面内容</div>;
    }
    

  • 重启开发服务器（执行npm run dev），路由结构变更后重启可避免缓存问题
  • 确认使用的Next.js版本为13.4及以上，早期版本的App Router存在部分路由兼容问题

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