Next.js路由问题：保留pages文件夹却移除路由中的/pages前缀

问题核心是你混用了Pages Router和App Router的命名规则，导致路由不符合预期。以下是两种保留文件夹结构的解决方案：

方法一：遵循Pages Router规则调整文件名 #

Pages Router（基于pages文件夹的传统路由系统）中，文件夹的默认页面需要命名为index.tsx，而不是page.tsx。你只需要：

• 将src/pages/about/page.tsx重命名为src/pages/about/index.tsx
• 之后直接输入/about即可访问该页面，同时保留pages/about的文件夹结构。

方法二：切换为App Router结构（推荐Next.js 13+） #

如果你学习的是Next.js 13及以上版本，更推荐使用App Router（当前官方主推的路由系统）：

• 将src/pages文件夹重命名为src/app
• 把src根目录的page.tsx移动到src/app文件夹下（作为网站首页/）
• 此时src/app/about/page.tsx会自动对应/about路由，完全满足你的需求，也符合App Router的规范。

补充说明 #

• Pages Router：默认页面用index.tsx，路由由pages文件夹下的文件路径直接映射（去掉pages前缀）
• App Router：默认页面用page.tsx，路由由app文件夹下的文件路径直接映射（去掉app前缀）

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