tomcat 部署vue前端项目_Tomcat部署vue项目

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

tomcat 部署vue前端项目_Tomcat部署vue项目相关推荐

tomcat设置context不生效_tomcat部署应用时设置context path为空的上下文路径问题
在server.xml中添加元素,配置如下: 在配置中包含如下信息: 1. 配置docBase值为:docBase="app"或者docBase="app.war&quo ...
白嫖他！悟空CRM项目，部署了直接用起来
悟空CRM采用全新的前后端分离模式,本仓库代码中已集成前端vue打包后文件,可免去打包操作如需调整前端代码,请单独下载前端代码,前端代码在根目录的ux文件夹中主要技术栈核心框架:jfinal3. ...
白嫖他悟空CRM项目，部署了直接用起来
作者 | 悟空CRM 整理 | 我是程序汪建议大家有时间把这个后台改成springboot.SpringMVC.spring的流行框架,这样可以锻炼下自己框架搭建. 悟空软件长期为企业提供企业管理软 ...
前端开发工程师（VUE框架）招聘
前端开发工程师(VUE框架) 岗位职责: 1.熟练运用HTML/JS/CSS等前端技术,精通JavaScript.Ajax.DOM.html.css等前端技术 2.熟练使用VUE前端框架,理解VUE框 ...
从零开始做Vue前端架构（5）
前言弄完了前后端分离,我们自然想打包发布项目了. 不多说,就让我们来看看吧. 开发直接上代码: const webpack = require('webpack') const path = re ...
Vue前端组件库介绍
kb-vue-components 组件库平台介绍这里汇集大家常用的Vue组件, 并提供相应组件的使用教程. 方便你找到适合自己的组件,并快速上手使用. 开源项目地址: kb-vue-compone ...
四、vue前端路由（轻松入门vue）
轻松入门vue系列 Vue前端路由七.Vue前端路由 1. 路由的基本概念与原理后端路由前端路由实现简单的前端路由 vue-router基本概念 2. vue-router的基本使用基本使用 ...
vue java实现登录_SpringBoot+Vue+Redis实现单点登录(一处登录另一处退出登录)
一.需求实现用户在浏览器登录后,跳转到其他页面,当用户在其它地方又登录时,前面用户登录的页面退出登录(列如qq挤号那种方式) 二.实现思路用户在前端填写用户信息登录后,后台接收数据先去数据库进行判 ...
Vue前端项目部署在tomcat
第一步配置java环境,下载tomcat后解压,然后将webapps里的默认文件删掉第二步修改vue项目下config/index.js,注意dev和build都要改assetsPublicPa ...

tomcat 部署vue前端项目_Tomcat部署vue项目

tomcat 部署vue前端项目_Tomcat部署vue项目相关推荐

最新文章

热门文章