如何避免使用vue-router的history模式时遇到express的常见问题？

本文共计3358个文字，预计阅读时间需要14分钟。

Vue-router 默认 hash 模式——利用 URL 的 hash 部分来模拟完整 URL，当 URL 改变时页面不会重新加载。若觉得 hash 过于丑陋，可使用路由的 history 模式，这种模式充分利用了浏览器的 HTML5 history API。

vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。

如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。

当你使用 history 模式时，URL 就像正常的 url，例如yoursite.com/user/id，也好看…

个人理解

上面是官方的解释，文档的一贯风格，只给懂的人看。两年前我比现在还菜的时候，看了这段话表示他在说个锤子，直接跳过了。

我不讲:hammer:，直接举:chestnut:

一般的我们把项目放到服务器上，路由都是在服务器中设置的。

比如网站www.text.com/ 中 admin目录下有一个login.html 的页面。当用户输入www.text.com/admin/login ，先解析www.text.com 域名部分得到服务器 ip 和 端口号，根据 ip 和 端口号找到对应的服务器中的对应的程序，然后在程序解析/admin/login 路径知道了你要找的是 admin 目录下的login.html 页面，然后就返回给你这个页面。

这是正常的方式，服务器控制一个路由指向一个页面的文件（不考虑重定向的情况），这样我们的项一般有多少个页面就有多少个 html 文件。

而 vue 中，我们打包好的文件其实是只有一个index.html ，所有的行为都是在这一个页面上完成。用户的所有的路由其实都是在请求index.html 页面。