必须配置前端路由系统，安装react-router-dom@6.22.2，创建src/router/index.jsx定义routes和route，用routerprovider替代createroot.render接入路由，访问/和/about可分别显示首页和关于页。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
在Cursor中新建React项目后，想让页面能通过不同URL地址切换显示内容，必须配置前端路由系统。没有这一步，所有导航都会触发整页刷新或直接404。
安装 react-router-dom
打开Cursor右下角终端（或按 Ctrl+`），确保已进入项目根目录，执行：
npm install react-router-dom@6.22.2
这一步必须完成，否则后续所有路由组件都无法识别。版本号写死是为避免 v7 的 breaking change 导致 <routes></routes> 报错。
创建 router 目录与入口文件
在 src 下新建文件夹 router，再在其中新建 index.jsx。
注意：不要建 router.js 或 routes.ts，Cursor 默认识别 .jsx 为 React 模块，且 index.jsx 可被自动解析，省去写默认导出路径的麻烦。
在 src/router/index.jsx 中写入基础结构：
import { Routes, Route } from 'react-router-dom';
export default function Router() {
return (
);
}
替换 main.jsx 的渲染逻辑
打开 src/main.jsx，删除原有 createRoot(...).render(<app></app>) 写法。
改用 【RouterProvider】 方式接入路由系统——这是 v6.4+ 推荐方式，支持 loader/action 等高级能力，且与 Cursor 的热重载兼容性更好。
修改后内容如下：
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { RouterProvider } from 'react-router-dom';
import Router from './router/index.jsx';
createRoot(document.getElementById('root')).render(
);
验证路由是否生效
启动开发服务器：npm run dev（或点击 Cursor 右上角 ▶️ 图标）。
浏览器访问 http://localhost:5173/，应看到「首页」文字；访问 http://localhost:5173/about，应看到「关于页」文字。
如果出现白屏或 404，请检查：① 终端是否有 Failed to resolve import 报错；② main.jsx 是否漏写了 RouterProvider；③ router/index.jsx 是否导出了默认函数组件。
