详解express使用vue-router的history踩坑

const router = new VueRouter({
 mode: 'history',
 routes: [{
    path: "/login",
    name: "login",
    component: login
  }]})

打开 url https://www.text.com/admin/login 会发现自动跳转到 https://www.text.com/login ，原因就是 /admin 的路由都指向了 vue 的 index.html 文件之后，js 根据我们的代码把url改成了 https://www.text.com/login ，如果我们不刷新页面没有任何问题，因为页面内所有的跳转还是 vue-router 控制， index.html 这个文件没变。但是如果刷新页面那就会出问题，服务器重新判断 /login 路由对应的文件。因此使用 history 模式时前端配置 vue-router 时也需要考虑后台的项目所在目录。

比如上面的例子应该改为，这样可以避免这种情况的问题

const router = new VueRouter({
 mode: 'history',
 routes: [{
    path: "/admin/login",
    name: "login",
    component: login
  }]})

参考链接

https://router.vuejs.org/zh/guide/essentials/history-mode.html#后端配置例子