Vue工程打包部署Tomcat，解决40静态路径等问题

在Vue项目打包后，部署到Tomcat服务器时，可能会遇到404错误和静态资源路径不正确的问题。以下是解决这些问题的方法：

1. 404错误：

   • 确保Tomcat的web.xml配置正确，如果是Servlet 3.0以上版本的Tomcat，则可以不用修改web.xml。
   • 如果Vue项目中使用了history模式的路由，需要配置Tomcat服务器支持HTML5 History模式。可以在Tomcat的web.xml中添加以下配置：

<web-app ...>
  <filter>
    <filter-name>UrlRewriteFilter</filter-name>
    <filter-class>org.tuckey.web.filters.urlrewrite.UrlRewriteFilter</filter-class>
    <init-param>
      <param-name>confReloadCheckInterval</param-name>
      <param-value>0</param-value>
    </init-param>
    <init-param>
      <param-name>logLevel</param-name>
      <param-value>WARN</param-value>
    </init-param>
  </filter>
  <filter-mapping>
    <filter-name>UrlRewriteFilter</filter-name>
    <url-pattern>/*</url-pattern>
    <dispatcher>REQUEST</dispatcher>
    <dispatcher>FORWARD</dispatcher>
  </filter-mapping>
  <!-- ... 其他配置 ... -->
</web-app>

2. 静态资源路径问题：

   • 确保Vue项目中的publicPath在vue.config.js中设置为Tomcat服务器的路径。例如：

module.exports = {
  // 默认情况下，Vue CLI假设您的应用将被部署在域名的根目录下
  // 如果应用被部署在一个子路径下，你需要在这里指定子路径
  // 例如，如果你的应用被部署在 https://www.my-app.com/my-app/
  // 那么将这个值改为 '/my-app/'
  publicPath: '/', // 根据Tomcat的实际路径进行修改
  // 其他配置...
}

• 如果你的Vue项目是打包在Tomcat的一个子目录下，那么publicPath应该设置为子目录的路径。例如，如果你的Vue应用被部署在http://yourdomain.com/my-app/，那么publicPath应该设置为'/my-app/'。

3. 构建配置：

   • 确保在构建项目时正确设置了基本URL。如果你的Tomcat服务器不在根路径下运行，你可能需要在vue-cli-service build命令中添加--base-url选项。

以上步骤应该能够解决大多数在Vue项目部署到Tomcat时遇到的404和静态资源路径问题。如果问题依然存在，可能需要检查Tomcat服务器的其他配置或者查看具体的错误日志来进一步诊断问题。