项目本地运行时候，首页子页面刷新均无问题。部署到服务器之后，刷新页面报错、出现404。
当vue项目的vue-router的mode为history路由模式时，若未进行相应的配置，可能会发生这种情况。
前端路由，即由前端来维护一个路由规则。实现有两种，一种时利用url的hash，也就是常说的锚点（#），JS通过hashChange事件来监听url的改变，IE7及以下需要轮询；另一种是HTML5的History模式，它使url看起来像普通网站那样，以“/”分割，没有#，但页面并没有跳转，不过使用这种模式需要服务端的支持，服务端在接受到所有请求后，都指向index.html文件，或设置404页面为index.html。不然刷新时页面会出现404。
---《Vue.js实战》
官方文档有给后端配置的例子
https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E5%90%8E%E7%AB%AF%E9%85%8D%E7%BD%AE%E4%BE%8B%E5%AD%90
后端已经将资源指向index.html仍出现这个问题，检查静态资源文件路径是否正确，这里仅以webpack4 + vue + vue-rout 自己搭建的项目为例。
如果域名为项目的根目录，资源文件引用的目录为绝对路径
<!--index.html-->
<body>
<div id="app"></div>
<script src="/dist/main.js"></script>
</body>
//生产环境配置文件,publicPath指定资源引用的目录
webpackBaseConfig.plugins = [];
module.exports = merge(webpackBaseConfig, {
output: {
publicPath: '/',//项目根目录为域名
// 将入口文件重命名为带有20位hash值得唯一文件
filename: '[name].[hash].js'
},
//...
}
最后一种解决方案，将项目入口文件中的路由配置，history模式去掉就好。vue-router默认使用hash模式。
//main.js
const RouterConfig = {
//mode: 'history',
//...
}
微信三方登录回调地址，有#号时，接收不到code参数；微信H5支付的回调地址，不允许有#；App分享，处理特殊字符时，可能会对#进行编译；#没有/好看。
