vue3项目部署到服务器，刚打开没事，一刷新页面就404-Toy模板网

这篇具有很好参考价值的文章主要介绍了vue3项目部署到服务器，刚打开没事，一刷新页面就404。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

vue3项目部署到服务器，刚打开没事，一刷新页面就404


vue3项目，在本地调试时各方面都没毛病，刷新也没毛病，

但是，

扔到服务器上，第一次打开是正常的，再刷新下就404了，

vue3项目部署到服务器，刚打开没事，一刷新页面就404,线上项目404-路由模式问题,vue.js

不知道什么原因。百度了下才发现问题所在

问题所在： vue-router历史模式的问题： vue3中历史模式，默认改为了HTML5模式：createWebHistory()

解决办法： createWebHistory 换成 createWebHashHistory，将历史模式，由当前的HTML5模式，改为，Hash模式文章来源地址https://www.toymoban.com/news/detail-800199.html

import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'

export default createRouter({
  // history: createWebHistory(),
  history: createWebHashHistory(),
  routes: [
    {
      path: '/login',
      name: 'login',
      meta: { title: '登录', icon: 'HomeOutlined' },
      component: () => import('@/views/user/Login.vue'),
    },
    {
      path: '/register',
      name: 'register',
      meta: { title: '注册', icon: 'HomeOutlined' },
      component: () => import('@/views/user/Register.vue'),
    },
    {
      path: '/forgotpwd',
      name: 'forgotpwd',
      meta: { title: '重置密码', icon: 'HomeOutlined' },
      component: () => import('@/views/user/ForgotPwd.vue'),
    }
  ],
})