Vue启用history mode 404的问题

前言

最近在使用 Vue 的过程中,对接微信公众号时遇到了 Vue 路由里面默认加上 # 号的坑,查资料发现启用 history mode 可以去掉这个 # 号,但是启用后发现访问之前的路由 404 了。原因是启用 history mode 之后需要由 index 文件去分配指定路由。废话不多说,下面上配置:

Nginx

在你的站点配置文件中加入一下代码:

1
2
3
4
location / {
...
try_files $uri $uri/ /index.html last;
}

顺便把 Apache 的配置也补上:

Apache

在你的站点配置文件中加入以下代码 :

1
2
3
4
<Directory your_project_path>
...
FallbackResource /index.html
</Directory>