vue.js - 使用 Vue-CLI 创建的应用程序提供 404 页面

Question

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

这有时会使调试 XHR 请求变得非常困惑。

如何让它返回 404 代码？

Answer 1

您观察到的特征实际上来自 webpack-dev-server's historyApiFallback ，它以 index.html 响应未解析的 URL(用于具有客户端路由的 SPA)。这在 Vue CLI 项目中默认启用，但您可以使用 Vue CLI 禁用它 devServer config :

1. 使用以下内容创建 vue.config.js(如果它尚不存在):

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

2. 重新启动您的开发服务器(npm run serve)。