Next.js新增dashboard页面遇404错误：访问路径无法找到页面求助

核心原因：App Router路由规则理解错误 #

Next.js 13+引入的App Router采用文件夹路由机制，和旧版Pages Router的结构完全不同：

• App Router不需要在src/app下创建pages文件夹，这个结构是Pages Router的用法
• 你当前的结构src/app/pages/dashboard.tsx对应的路由路径是/pages/dashboard，而非你期望的/dashboard，所以访问/dashboard会返回404

正确的实现步骤 #

• 删除src/app/pages文件夹
• 在src/app目录下直接创建名为dashboard的文件夹
• 在src/app/dashboard文件夹内创建page.tsx文件，将原dashboard.tsx的组件代码迁移到这个文件中

额外提醒 #

如果你的项目同时存在根目录下的pages文件夹（Pages Router）和src/app（App Router），两者是独立生效的，但不要在src/app内嵌套pages文件夹，这会混淆路由规则。

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