项目发布后通常有两种访问方式，
第一种： IP+端口直接访问的方式，如 http://192.168.4.160:6090/
第二种：IP+端口+项目名，如 http://192.168.4.160:6090/huangshi/
-
IP+端口的方式需要修改Tomcat -> conf/server.xml, 增加Context节点, 设置
docBase="/huangshi"其中的huangshi就是webapps目录下的项目名称（文件夹名）<Context docBase="/huangshi" path="" reloadable="true" />
如下图
image.png IP+端口+项目名 这种方式的部署需要在vue项目源码上作些修改
首先 路由的配置上，增加base:'项目名称'
const router = new Router({
base: 'huangshi',
mode: 'history',
linkActiveClass: 'active',
linkExactActiveClass: 'active',
routes: routes
})
export default router
其次修改 vue.config.js,增加publicPath配置项，如果没有这个文件，手动增加
比如：
module.exports = {
devServer: {
port: 8888,
proxy: {
'/api': {
target: 'http://192.168.4.189:8085/api',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
},
publicPath:'huangshi'
}
因为是history模式, 要防止在路由下刷新变成404错误，这需要让tomcat都定位到首页，也就是index.html页， 在项目目录下新建WEB-INF文件夹， 接着在WEB-INF文件夹下新建 web.xml文件，内容如下：
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1" metadata-complete="true">
<display-name>Router for Tomcat</display-name>
<error-page>
<error-code>404</error-code>
<location>/index.html</location>
</error-page>
</web-app>
大致意思就是 服务端404时就去到index.html页，这样客户端的history模式路由就会生效。
