记录第一次VUE与springboot部署在同一tomcat下出现的问题及解决方法
多模块springboot打包
使用idea右侧maven在父模块执行install,在入口模块执行打包package即可,由于我要打包成war文件放在tomcat,其他模块pom文件中打包方式未jar即可,入口文件为war。
vue打包
npm run build
将出现的dist文件夹复制进入tomcat即可运行,dist改成你想要的项目名即可
出现的问题
- 1.springboot打包找不到主类的的问题
这个问题提示是除了入口模块,其他模块均存在该问题,网上一些教程说出现该问题后再每个模块新建一个类,可以什么都不写,只写一个main函数即可(经过测试确实可行)
解决方法:出现此问题主要原因在于将打包等插件放在了其他包pom文件或者父pom文件下,我们应该打包入口模块,将pom插件放在入口模块下即可解决 - vue打包文件夹出现 Error: EPERM: operation not permitted, mkdir...
此问题为无权限创建文件夹(即使有权限有可能也会出现此问题),到项目文件夹,“右键-属性-安全-编辑”,直接将权限全打开即可,打开后仍然出现此问题的,无需理会,此时执行打包,即使仍报此错误,但是你会发现dist文件夹已经出现,里面的文件已经出现。(此问题主要出现在项目文件在C盘时) - 访问首页404或者空白的问题
首页404,说明并未找到页面,检查访问路径,检查是否放置正确。出现空白页,打开F12或者右键“检查”,打开“网络”,刷新页面,可以看到出现的请求,此时可能会发发现css、js文件请求错误,请求链接缺少项目名。
修改放法一.将css、js等文件转移到tomcat的webapps的ROOT目录下,即可访问。
修改方法二:将vue的vue.config.js文件的内容中的module.exports 中的
publicPath由"/"改为"./",前者表示在根目录下,后者表示在当前目录下。 - 首页可以访问,刷新或者访问其他页面出现空白页404的问题
网络上博客说解决问题方法是将tomcat的serve.xml修改成出现404即跳转到首页,本人未测试。
解决方法:放弃vue路由的hostory历史模式,改为默认模式。
如实在想用历史模式,请参考https://juejin.cn/post/6844904047963537422 - vue页面请求不到springboot接口、浏览器控制台报跨域的问题
查看vue中是否将请求接口地址配置正确,如果正确却仍然请求不到,F12检查请求接口地址,通过浏览器或者请求工具查看是否能够请求到,如果他们可以页面却不行,查看浏览器控制台,可能已经报了跨域的问题,百度说的是将后端配置类中写允许跨域的配置,本人未测试,因为我将前端和后端部署在同一个tomcat下,使用同一个端口,怎么可能出现跨域的问题?但是浏览器控制台确实报了这个错误。在web容器中,前端配置的代理将会失效,此时最好是删除代理的相关配置,另外请将springboot的配置文件中的端口修改到与当前tomcat端口一致,或和直接删除,本人想法:既然我已经打包成war包,按理说端口号已经失效,但是事实上仍然影响(疑惑?)因为并且浏览器地址栏直接输入接口地址可以正常使用,但是同样的接口地址vue页面就是请求不到。
后续补充.....