使用Vue-CLI创建的应用为404页面提供服务

Question

我正在使用Vue-CLI创建Vue应用。我不喜欢的一种行为是，使用代码200提供任何不存在的URL（例如localhost:8080/nonexistent/file.html），就像它的根一样：localhost:8080。

这使得调试XHR请求有时真的很混乱。

如何使其返回404代码？

Answer 1

您正在观察的功能实际上来自webpack-dev-server's historyApiFallback，对于未解析的URL（用于带有客户端路由的SPA），它以index.html进行响应。默认情况下，在Vue CLI项目中启用了此功能，但是您可以使用Vue CLI devServer config将其禁用：

1. 使用以下内容创建vue.config.js（如果尚不存在）：

   module.exports = {
     devServer: {
       historyApiFallback: false
     }
   }
   

2. 重新启动开发服务器（npm run serve）。