.NET 8 Blazor Server项目dx-blazor.js/css 404错误求助

核心原因 #

1. 缺少Dashboard专属NuGet包：DxDashboardViewer属于DevExpress Dashboard组件范畴，仅安装基础的DevExpress.Blazor包无法提供Dashboard所需的静态资源和服务支持。
2. 静态文件中间件未启用：.NET 8 Blazor Server项目需显式配置UseStaticFiles()中间件，否则无法访问Razor类库提供的_content路径下的静态文件。
3. 遗漏Dashboard专属静态资源引用：除基础的dx-blazor.css/js外，Dashboard组件还需加载专属的样式与脚本文件。

解决步骤 #

1. 安装正确的NuGet依赖 #

卸载现有DevExpress.Blazor包，安装对应版本的DevExpress.Dashboard.Blazor包：

dotnet remove package DevExpress.Blazor
dotnet add package DevExpress.Dashboard.Blazor --version 25.1.5
dotnet restore

2. 配置Program.cs服务与中间件 #

确保服务注册和中间件顺序正确，添加Dashboard服务并启用静态文件支持：

var builder = WebApplication.CreateBuilder(args);

// 注册基础Blazor服务
builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();

// 注册DevExpress Blazor及Dashboard服务
builder.Services.AddDevExpressBlazor();
builder.Services.AddDevExpressDashboard(config => {
    // 配置仪表盘存储（示例：文件系统存储，需创建对应目录）
    config.SetDashboardStorage(new DashboardFileStorage("Data/Dashboards"));
});

var app = builder.Build();

if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    app.UseHsts();
}

app.UseHttpsRedirection();
// 启用静态文件中间件，确保能访问_content路径下的资源
app.UseStaticFiles();

app.UseRouting();

app.MapBlazorHub();
app.MapFallbackToPage("/_Host");
// 映射Dashboard API端点（Viewer必须依赖此端点加载数据）
app.MapDashboardRoute("dashboardApi");

app.Run();

3. 修正_Host.cshtml的静态资源引用 #

添加Dashboard专属的静态文件，确保路径正确：

<head>
    <!-- 基础DevExpress Blazor样式 -->
    <link href="_content/DevExpress.Blazor/dx-blazor.css" rel="stylesheet" />
    <!-- Dashboard组件专属样式 -->
    <link href="_content/DevExpress.Dashboard.Blazor/dx-dashboard.blazor.css" rel="stylesheet" />
</head>
<body>
    <component type="typeof(App)" render-mode="ServerPrerendered" />

    <script src="_framework/blazor.server.js"></script>
    <!-- 基础DevExpress Blazor脚本 -->
    <script src="_content/DevExpress.Blazor/dx-blazor.js"></script>
    <!-- Dashboard组件专属脚本 -->
    <script src="_content/DevExpress.Dashboard.Blazor/dx-dashboard.blazor.js"></script>
</body>

4. 验证仪表盘存储（必要步骤） #

若使用DashboardId="MyDashboard"，需确保项目中存在对应仪表盘文件：

• 在项目根目录创建Data/Dashboards文件夹
• 将名为MyDashboard.xml的仪表盘文件放入该目录（可通过DevExpress Dashboard设计器生成）

额外排查点 #

• 清理项目：删除bin和obj目录后重新构建，避免缓存问题
• 版本一致性：确保所有DevExpress NuGet包版本统一为25.1.5，避免版本冲突
• 路径大小写：部署到Linux环境时，需保证_content路径中的包名大小写与NuGet包名称一致

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