React Router 本地开发指南
React Router v7 整合原 Remix 能力,支持 SPA、SSR 与全栈路由,本地默认 localhost:5173 开发。
React Router(v7 起)整合了原 Remix 框架的全栈能力:文件系统路由、数据加载(loader/action)、服务端渲染与流式传输。适合需要 SEO 与服务器逻辑的 React 应用。
快速开始
使用官方模板创建项目:
npx create-react-router@latest my-app
cd my-app
npm install
npm run dev默认 localhost 访问
| 用途 | 地址 |
|---|---|
| 开发服务器 | http://localhost:5173 |
| 生产模式本地运行 | 依 react-router-serve 配置,常见为 3000 端口 |
具体端口以终端输出为准;可在 Vite / 服务器配置中修改。
与 Remix 的关系
- Remix 已合并进 React Router v7,新文档与包名统一为 React Router
- 旧 Remix 项目可逐步迁移;路由、loader、action 等概念保持一致
- 部署目标包括 Node.js 服务器、Cloudflare Workers、Netlify 等
常用命令
| 命令 | 说明 |
|---|---|
npm run dev | 开发模式 |
npm run build | 构建客户端与服务端产物 |
npm run start | 运行生产构建(全栈模式) |
小结
React Router 是 React 生态的全栈路由方案,本地开发通常从 http://localhost:5173 开始。需要纯 SPA 时可仅用客户端路由;需要 SSR 时使用框架默认的全栈模式。