Blazor WASM开发中Razor文件非C#修改刷新不生效求助

这是预渲染配置场景下的常见问题，核心原因是WASM客户端的静态资源缓存机制，以及预渲染DOM与客户端初始化后DOM的同步冲突。以下是具体解决办法：

• 开启WASM自动重建配置
  在项目的.csproj文件中添加以下配置（.NET 6及以上版本支持），确保非C#内容修改能触发客户端程序集重建：

  <PropertyGroup>
    <BlazorWebAssemblyEnableAutoRebuild>true</BlazorWebAssemblyEnableAutoRebuild>
  </PropertyGroup>
  

  同时检查Properties/launchSettings.json，确认hotReloadEnabled设置为true。

• 禁用开发环境客户端缓存
  在客户端Program.cs中，针对开发环境添加缓存禁用逻辑：

  if (builder.Environment.IsDevelopment())
  {
      builder.Services.AddHttpClient("AppHttpClient", client => 
          client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress))
          .AddHttpMessageHandler(() => new HttpClientHandler
          {
              CachePolicy = new HttpRequestCachePolicy(HttpRequestCacheLevel.NoCacheNoStore)
          });
  }
  

  另外在wwwroot/index.html头部添加缓存控制meta标签：

  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
  <meta http-equiv="Pragma" content="no-cache" />
  <meta http-equiv="Expires" content="0" />
  

• 同步预渲染与客户端内容逻辑
  预渲染页面能更新但客户端加载后回退，是因为客户端初始化时会替换预渲染DOM。避免在Razor组件中写死静态文本，改用绑定或参数传递内容，比如：

  <!-- 不推荐：写死静态文本 -->
  <p>旧文本</p>
  
  <!-- 推荐：使用绑定或参数 -->
  <p>@DisplayText</p>
  
  @code {
      [Parameter] public string DisplayText { get; set; } = "新文本";
  }
  

• 手动触发编译更新
  如果热更新仍不生效，修改Razor内容后按下Ctrl+Shift+B手动编译项目，再刷新页面即可看到变更。

至于razor.css能实时生效，是因为Blazor开发服务器对CSS文件的热更新做了单独处理，会直接推送样式变更到客户端，无需重建WASM程序集。

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