Vue.js 客户端与WebpackDevMiddleware 404s的深度链接

我正在使用WebpackDevMiddleware for Development builds为使用客户端路由的Vue.js应用程序提供服务。SPA应用程序可以从根url正常运行，但是如果我尝试使用任何客户端深度链接，我会得到404

注：按预期在生产过程中运行

我想要的是：

• http://locahost/

  -启动vue应用程序

• http://localhost/overlays/chat

  -启动vue应用程序

• http://localhost/api/*

  -提供服务器端处理的api路由

在这个问题上有一个最小可行的复制。您可以使用vscode调试作为发生错误的开发环境来运行它。还有一个脚本

/scripts/local production

，它将作为生产环境构建和运行，并在其中按预期工作

my Startup.cs的相关部分如下所示：

公共类启动
{
公共IConfiguration配置{get；}
公共启动（IConfiguration配置）
{
配置=配置；
}
public void配置服务（IServiceCollection服务）
{
services.AddMvc（）；
//在生产中，将提供Vue文件
//从这个目录
services.AddSpaStaticFiles（配置=>
{
configuration.RootPath=configuration[“Client”]；
});
}
公共无效配置（IApplicationBuilder应用程序，IHostingEnvironment环境）
{
//设置默认mvc路由
app.UseMvc（路由=>
{
MapRoute（“默认”，“api/{controller=Home}/{action=Index}/{id？}”）；
});
//为开发人员和产品设置spa路由
if（env.IsDevelopment（））
{
app.UseWebpackDevMiddleware（新的WebpackDevMiddlewareOptions{
HotModuleReplacement=true，
ProjectPath=Path.Combine（env.ContentRootPath，配置[“ClientProjectPath”]），
ConfigFile=Path.Combine（env.ContentRootPath，配置[“ClientProjectConfigPath”]）
});
}
其他的
{
app.UseWhen（context=>！context.Request.Path.Value.StartsWith（“/api”），
生成器=>{
app.UseSpaStaticFiles（）；
app.UseSpa（spa=>{
spa.Options.DefaultPage=“/index.html”；
});
app.UseMvc（路由=>{
routes.MapSpaFallbackRoute(
名称：“水疗后援”，
默认值：新建{controller=“Fallback”，action=“Index”}）；
});
});
}
}
}

我可以使用状态代码页中间件处理所有状态代码，并使用根路径重新执行。这将导致spa应用程序提供400-599范围内的所有状态代码，这不是我想要的，但至少让我重新工作

//为dev和prod设置spa路由
if（env.IsDevelopment（））
{
//强制客户端深度链接在404s上渲染spa
app.UseStatusCodePagesWithReExecute（“/”）；
app.UseWebpackDevMiddleware（新的WebpackDevMiddlewareOptions{
HotModuleReplacement=true，
ProjectPath=Path.Combine（env.ContentRootPath，配置[“ClientProjectPath”]），
ConfigFile=Path.Combine（env.ContentRootPath，配置[“ClientProjectConfigPath”]）
});
}

希望这将有助于将来可能遇到这个问题的人