项目场景：

Maven是一个项目管理工具，可以对 Java 项目进行构建、依赖管理。Maven 也可被用于构建和管理各种项目，例如 C#，Ruby，Scala 和其他语言编写的项目。那么我们也可以使用他构建一个前后端打包为一个jar包的项目。
使用的技术为 Spring Boot + Vue ， 使用 Maven 进行打包。
使用vue-router进行路由管理：Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。

问题描述：

在 vue 和 Spring boot 使用Maven工具进行打为jar包后

本地运行jar 或 部署至服务器 时，出现vue前端界面刷新404情况

原因分析：

Vue Router History 模式 介绍

vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL
改变时，页面不会重新加载。

如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成
URL 跳转而无须重新加载页面。

但是在我的这个项目结构中，是把他们打包出来运行的，
在history模式下的url会请求到服务器端，但是服务器端并没有这一个资源文件（即这个路径是走不通的），就会返回404，
所以我们要在vue项目的vue.config.js文件中进行配置。

解决方案：

在vue项目的vue.config.js文件中增加以下配置：

 	historyApiFallback: {
        index: '/index.html' //与output的publicPath
    },

具体如下：

module.exports = {
    outputDir: 'dist',   //build输出目录
    assetsDir: '', //静态资源目录（js, css, img）
    lintOnSave: false, //是否开启eslint
    publicPath: '/',   //这个必须，引入静态资源需要从根路径引入，否则会找不到静态资源
    devServer: {
        open: true, //是否自动弹出浏览器页面
        host: "localhost",
        port: '8080',
        // history模式下的url会请求到服务器端，但是服务器端并没有这一个资源文件，就会返回404，所以需要配置这一项
        historyApiFallback: {
            index: '/index.html' //与output的publicPath
        },
    }
}