vue在history模式下刷新页面404

在vue的项目中我们为了美化路由而选择history模式，但是使用了history模式时刷新页面会出现404。

import Vue from 'vue'
import VueRouter from 'vue-router'
import Nav from '../views/Nav.vue'

Vue.use(VueRouter)

export default new VueRouter({
    mode: 'history'
}）

造成这种原因是因为服务端并不能够解析，所以我们需要在服务端进行解析。

以NodeJS为例，我们直接使用connect-history-api-fallback中间件来解决

var history = require('connect-history-api-fallback');

方式一

var connect = require('connect');

var app = connect()
  .use(history())
  .listen(3000);

方式二

var express = require('express');

var app = express();
app.use(history());