Vue项目在tomcat中刷新会报404

我的是SPA页面，在打包后把文件放到tomcat的文件里的时候，如果在不刷新和重新输入url的时候控制台不会报错，也能成功运行，但是刷新或者重新输入url后就会报404错误找不到页面，然后我在论坛搜寻资料后发现了原因，url输入和刷新是属于后端路由，需要重新找资源，而我在tomcat文件里没有这个文件所以会报错，于是我用了下面的方法，在遇到404的时候就会重新进入这个页面，然后根据前端路由重新渲染页面，这时候刷新和重新输入url也能出现内容，但是控制台还是会报错，请问有什么办法能解决这个报错吗？

<?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>

img