如何在Visual Studio 2019调试React+.NET5项目时新增/重命名文件及文件夹

Visual Studio原生的「编辑并继续」功能仅针对.NET后端代码生效，前端文件的修改锁定需要单独调整配置，按以下步骤操作即可实现调试过程中新增、重命名React目录下的文件夹及jsx/tsx文件：

• 调整SPA服务配置
  打开项目的Startup.cs文件，在Configure方法中修改SPA配置段，显式关闭静态资源缓存：

app.UseSpa(spa =>
{
    spa.Options.SourcePath = "ClientApp";
    if (env.IsDevelopment())
    {
        spa.UseReactDevelopmentServer(npmScript: "start");
        // 新增以下配置，解除静态资源调试锁
        spa.Options.DefaultPageStaticFileOptions = new StaticFileOptions
        {
            OnPrepareResponse = ctx =>
            {
                ctx.Context.Response.Headers["Cache-Control"] = "no-cache, no-store, must-revalidate";
            }
        };
    }
});

• 修改.NET项目文件配置
  右键.NET项目，选择「编辑项目文件」，在根节点下的<PropertyGroup>中添加3个配置项：

<DisableFastUpToDateCheck>true</DisableFastUpToDateCheck>
<EnableManagedSnapshotDebugging>false</EnableManagedSnapshotDebugging>
<TypeScriptCompileBlocked>true</TypeScriptCompileBlocked>

该配置会关闭调试过程中VS对前端目录的文件扫描锁定，同时禁止VS自带的TS编译流程，交由React的本地开发服务处理编译逻辑。

• 调整VS全局调试配置

1. 打开工具 -> 选项 -> 调试 -> 常规，取消勾选「调试时要求源文件与原始版本完全匹配」
2. 打开工具 -> 选项 -> 项目和解决方案 -> 生成并运行，将「运行时，当项目过期时」设置为「从不生成」，「运行时，出现生成或部署错误时」设置为「不启动」

配置完成后重启Visual Studio，再次进入调试模式即可自由修改前端目录下的文件和文件夹，React自带的热重载服务会自动检测变更同步到页面，无需中断调试进程。
如果配置后仍不生效，可以删除React项目目录下的node_modules/.cache文件夹，重新执行npm install后再启动调试即可。

内容的提问来源于stack exchange，提问作者Jenan