41、构建 React 应用的详细指南

构建 React 应用的详细指南

1. 项目准备

在开始之前，需要启动 Web 服务和 React 开发工具。具体操作如下：
- 打开命令提示符，导航到项目文件夹。
- 运行以下命令：

npm start

初始构建过程完成后，会打开一个新的浏览器窗口并显示示例应用程序。

2. 配置 URL 路由

大多数实际的 React 项目都依赖于 URL 路由，它使用浏览器的当前 URL 来选择要显示给用户的组件。React 本身不提供内置的 URL 路由支持，常用的是 React Router 包。
- 安装 React Router 包和类型定义文件 ：
打开新的命令提示符，导航到项目文件夹，运行以下命令：

npm install react-router-dom@5.2.0
npm install --save-dev @types/react-router-dom

• 应用支持的 URL 及用途 ：
  | 名称 | 描述 |
  | ---- | ---- |
  | /products | 显示之前定义的 ProductList 组件 |
  | /order | 显示订单详情的组件 |
  | /summary | 显示订单发送到服务器后的摘要信息，URL 会包含订单编号，如 /sum