vue单页应用使用vue-router会有两种配置,即history模式和hash模式,但是hash模式其实会有很多限制,最主要的一点,url地址太丑了,所以我们在生产环境中也希望用到history模式。
那么问题来了,我们在使用nginx或者apache等代理服务器的时候,会遇到404的问题,因为vue项目编译出来的dist中,并没有真正的本地资源提供给nginx或者apache,正确的做法是需要转交给vue-router来做前端路由。
nginx配置(已验证)
server {
listen 80;
server_name localhost;
index index.html;
root /root/dist;
location / {
root /root/dist;
try_files $uri $uri/ /index.html =404;
}
}