问题原因：

刷新页面时访问的资源在服务端找不到，因为vue-router设置的路径不是真实存在的路径

 

解决方案：

第一步：后端配置

Apache

<IfModule mod_rewrite.c>RewriteEngine OnRewriteBase /RewriteRule ^index\.html$ - [L]RewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-dRewriteRule . /index.html [L]
</IfModule>

nginx

location / {try_files $uri $uri/ /index.html;
}

Native Node.js

const http = require("http")
const fs = require("fs")
const httpPort = 80http.createServer((req, res) => {fs.readFile("index.htm", "utf-8", (err, content) => {if (err) {console.log('We cannot open "index.htm" file.')}res.writeHead(200, {"Content-Type": "text/html; charset=utf-8"})res.end(content)})
}).listen(httpPort, () => {console.log("Server listening on: http://localhost:%s", httpPort)
})

第二步：前端配置

const router = new VueRouter({mode: 'history',routes: [{ path: '*', component: NotFoundComponent }]
})


-------------------------------------------------------------------------------------------------
如：

   // 404未找到
        {path: '*',component: notFind,meta: {title: '404未找到',},},