实际项目中不一定都是一个后端对应一个前端，这时，共用后端就成为可能。
本项目采用前后端分离开发，下面说说，如何部署的问题，这里采用整合部署打包成jar的方式，而非nginx部署。
首先部署第一个前端项目，即springboot+vue项目整合部署，和普通的项目整合部署相同。
1. 前端使用npm run build命令打包好，然后把dist目录下打包好的文件，直接粘贴放在后端项目的 src/main/resources/static
接下来，开始部署第二个前端项目。
2.由于头一个项目（放在static根目录下）已经占用了后端项目的 ‘/’ 路径， 即访问 http://xxxxx:8080/ 的时候，跳转的是第一个前端项目的网页。所以，第二个前端项目应该有一个单独的路径，用以区分，即需要建立后端项目的二级目录，子包路径。
第二个前端项目依次做如下配置，
1.vue-router：
vue-router官网有如上描述，所以 /app/ 就是你的第二个前端项目的访问路径。vue-router的index.js配置如下：
export default new Router({
// base为添加的配置项
base: '/screenIndex/',
routes: [{
path: '/',
name: 'Index',
component: main
}]
})2. vue.config.js ：
新版本vue-cli项目采用vue.config.js来替代旧版本项目中的config build 两个目录的文件，这里也不在详述它们的区别。
根据官方描述，可知，需配置一个publicPath选项。vue.config.js配置如下：
module.exports = {
// process.env.NODE_ENV 用以区别是开发环境还是生成环境，在生成环境下 配置为 /screenIndex/
publicPath: process.env.NODE_ENV === 'production' ? '/screenIndex/' : '/',
...
}完成以上配置后，将项目打包，打包出来的文件应该部署在后端项目的 src/main/resources/static/screenIndex/ 目录下， /screenIndex/
额外的，我另外添加了一个controller接口用以跳转该项目，然后通过访问接口路径来访问第二个前端项目，如下：
@GetMapping
public ModelAndView index() {
return new ModelAndView("screenIndex/index.html");
}
遇到的问题：
访问第二个项目时：
1.浏览器报错，显示找不到静态资源，排查原因，vue项目打包是否打包好了，配置的子包名和static下包名是否一致，这里是 screenIndex。
2.报500，后台日志显示无法解析 '/screenIndex/index.html'，排除原因，controller接口跳转路径前去掉 '/'。
3.跳转成功，但显示空白页。
如果排查过后仍无法解决，还有一个原因，可能是由于idea抽了， 解决方法：
重启idea，清除缓存，在启动项目就好了，作者亲测有效。
