aspnet-core-react-redux-playground-template 的安装和配置教程

2025-05-18 23:43:58作者：裘旻烁

项目基础介绍和主要编程语言

本项目是一个单页应用程序（SPA），它使用 ASP.NET Core 7.0 作为 REST API 服务器，前端使用 React、Redux 和 TypeScript 进行构建。该模板集成了热模块替换（HMR）功能，能够提供更加流畅的开发体验。项目主要使用的编程语言是 TypeScript 和 C#。

项目使用的关键技术和框架

项目中使用了一系列的关键技术和框架，主要包括：

服务器端：ASP.NET Core 7.0、SignalR、HealthChecks、AspNetCore.HealthChecks.UI、Swagger UI（通过 NSwag.AspNetCore 实现）。
客户端：React、Redux、Webpack（用于打包应用资源和支持HMR）、Bulma CSS、SASS、Font Awesome 5、styled-components、react-functional-select、Axios、react-toastify、react-router/react-router-dom。
其他：自定义的可复用 Dropdown 和 Checkbox 组件，以及两种不同的加载器组件（旋转器和认证动画）。

项目安装和配置的准备工作

在开始安装之前，请确保您的系统满足了以下要求：

Node.js 版本 >= 14
.NET 7.0 SDK

如果您的系统中还没有安装上述环境，请先进行安装。

安装步骤

克隆项目仓库
打开命令行，执行以下命令克隆项目仓库：

git clone https://github.com/based-ghost/aspnet-core-react-redux-playground-template.git

安装 Node.js 依赖
进入到项目目录中的 ClientApp 文件夹，然后运行以下命令安装 Node.js 的所有依赖：
```
npm install
```
恢复 .NET Core 依赖
打开 Visual Studio 或 Visual Studio Code，使用 .sln 文件或 .csproj 文件打开项目。Visual Studio 应该会自动恢复 NuGet 包和其他依赖项。如果使用 Visual Studio Code，可能需要手动执行 dotnet restore 命令来恢复依赖。
构建和运行项目
在 Visual Studio 或 Visual Studio Code 中，构建并运行项目。在 Visual Studio 中可以直接按 F5 进行调试，而在 Visual Studio Code 中则需要先执行 dotnet run 命令。