使用使用Vue-CLI创建的应用程序为404页面提供服务 [英] Serve a 404 page with app created with Vue-CLI

问题描述

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

这有时会使调试XHR请求变得非常混乱。

如何使其返回404代码？

推荐答案

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

1. 创建vue.config.js(如果不存在)，内容如下：

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

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

这篇关于使用使用Vue-CLI创建的应用程序为404页面提供服务的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！