创建 React 项目

在本 5-10 分钟的 Visual Studio 集成开发环境（IDE）简介中，你将创建并运行简单的 React 前端 Web 应用程序。

先决条件

请确保安装以下软件：

• Visual Studio 2022 或更高版本。 转到 Visual Studio 下载 页面来免费安装它。
• npm （https://www.npmjs.com/），包含在 Node.js 中

创建应用

1. 在“开始”窗口中（文件>开始窗口 打开），选择 创建新项目。

   显示创建新项目屏幕截图

2. 在顶部的搜索栏中搜索 React，然后根据您的偏好选择 JavaScript 或 TypeScript 版本的 React 应用程序。

   

   从 Visual Studio 2022 版本 11 开始，模板名称从 独立 JavaScript React Project 更改为 React 应用。

3. 为项目和解决方案命名。

4. 选择 创建，然后等待 Visual Studio 创建项目。

   请注意，创建 React 项目需要一段时间，因为此时运行的 create-react-app 命令也会运行 npm 安装命令。

查看项目属性

使用默认项目设置可以生成和调试项目。 但是，如果需要更改设置，请右键单击解决方案资源管理器中的项目，选择“属性”，然后转到“Lint 分析”、“生成”或“部署”部分。

对于调试器配置，请使用 launch.json。

注意

launch.json 存储与“调试”工具栏中的“开始”按钮关联的启动设置。 目前，launch.json 必须位于 .vscode 文件夹下。

构建您的项目

选择“生成”>“生成解决方案”以生成项目。

启动项目

按 F5 或选择窗口顶部的 “开始”按钮，你将看到命令提示符，例如：

• VITE v4.4.9 在 780 毫秒内准备就绪

注意

请检查控制台输出中的消息，例如提示你更新 Node.js版本的消息。

接下来，应会看到基础 React 应用出现！

后续步骤

创建 React 应用

对于 ASP.NET Core 集成：

使用 React 创建 ASP.NET Core 应用