tomcat 部署vue前端项目_Tomcat部署vue项目
1、将前端打包后的文件 内容拷贝到Tomcat的webapps下,可以直接丢入一个文件夹,访问时链接需要文件夹名称。为了链接的简洁可以直接放在ROOT下。2、此时可能遇到的问题一、启动后访问不到,页面F12显示如下图,那么就需要检查一下配置的访问路径是否对的。当前我是把dist文件夹放在webapp下。需要在前端代码配置一下访问路径加上dista、首先打包之前需要修改config文件夹下的inde
1、将前端打包后的文件 内容拷贝到Tomcat的webapps下,可以直接丢入一个文件夹,访问时链接需要文件夹名称。为了链接的简洁可以直接放在ROOT下。
2、此时可能遇到的问题
一、启动后访问不到,页面F12显示如下图,那么就需要检查一下配置的访问路径是否对的。当前我是把dist文件夹放在webapp下。需要在前端代码配置一下访问路径加上dist
a、首先打包之前需要修改config文件夹下的index.js如果在webapps下创建dist文件夹作为项目包,则需要配置config/index.js文件,设置assetsPublicPath: '/dists/'这里改为这个配置之后,最后编译产生的index.html中相关路径也会带上‘/hms’,不会报404的错误了,具体的配置信息具体配置。
b、其次记得要添加404路由页面
二、vue项目路由在history模式下布置在Tomcat刷新会出现404问题,解决方案(需要根据前端的实际情况进行配置)
a、在tomcat的webapps下的前端文件夹下新建WEB-INF文件夹,并在该文件夹下建立web.xml文件,具体内容如下
b、web.xml文件内容
-
Router for Tomcat
-
404
/index.html
3、进入config 需改配置文件 server.xml 修改成自己开放的端口
4、进入到tomcat bin目录下启动tomcat 对应部署系统使用不同的启动命令startup.bat / startup.sh
5、访问地址 http://localhost:19000/index.html
更多推荐
所有评论(0)