vue-router文档中只有关于Apache，nginx等配置的说明，同过查询找到了以下方法解决tomcat下history模式的问题。创建WEB-INF文件，文件夹中创建web.xml


在web.xml中输入以下内容

<?xml version="1.0" encoding="ISO-8859-1"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
                      http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
  version="3.0"
  metadata-complete="true">

  <display-name>webapp</display-name>
  <description>
     webapp
  </description>
  <error-page>  
   <error-code>404</error-code>  
   <location>/</location>  
</error-page>  
</web-app>

按照这个配置完成后发现页面还是空白的，经过研究发现我们还需要再vue-router中进行配置，因为代码是在mobile目录下，路由进行以下配置。

我使用的vue-cli 3.x vue-cli打包配置还需要设置以下内容：

module.exports = {
  publicPath: "/mobile",
  configureWebpack: {
    performance: {
      hints: false
    }
  }
};

这样我们就实现tomcat下配置history模式了。