【Vue】路由模式和各自之间的区别

histroy路由（html模式路由）

hash路由在vue2中的设置为mode："history"，在vue3中可以使用history: createWebHashHistory()进行设置
特点：

• 如果没有对应的服务器设置，会出现一个404错误（解决：在服务器上添加回退路由）

hash路由

hash路由在vue2中的设置为mode："hash"，在vue3中可以使用history: createWebHistory()进行设置

特点：

• hash模式的路由url带有“#”
• hash值未被发送到服务器上，不需要服务器层面上的任何特殊处理
• 不利于SEO

记录

刷新出现404怎么解决

1. 在服务器上添加回退路由
2. 在vue.config.js文件中

module.exports = {
  devServer: {
    // history模式下的url会请求到服务器端，但是服务器端并没有这一个资源文件，就会返回404，所以需要配置这一项
    historyApiFallback: {
        index: '/index.html' //与output的publicPath
    },
  },
}