vue3 打包部署到tomcat

有个vue3的项目,要部署到tomcat,网上看了半天,鱼龙混杂,奈何环境不允许google,最终还是配出来了,特此记录下。

特此声明:只根据本项目实际情况,该配置可用,请根据你自己的项目灵活思考。。。

 

一、改vue.config.js

       publicPath改为./ , outputDir可以改为你要部署的项目名称,这样就省的建文件夹,以及再从dist下面拷贝了。 devServer中增加assetsPublicPath : './',proxy的话根据实际情况,因为我部署到线上,通过zuul网关,所以,我将proxy中的内容全部注释了。

vue3 打包部署到tomcat_第1张图片

 

二、router配置文件中,base配置为访问路径。就是你的项目路径。如下图

注意这个history模式,如果你也是history模式,则你必须要在tomcat->webapps->你的项目下面新建一个WEB-INF目录。

并在里面新建一个web.xml,将下面代码复制进去


  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">
  Router for Tomcat
 
    404
    /index.html
 

注意,建立这个目录和web.xml很重要,不建立的话,就报404,很重要,说三遍!!!!!!!!!!!!!!

注意,建立这个目录和web.xml很重要,不建立的话,就报404,很重要,说三遍!!!!!!!!!!!!!!

注意,建立这个目录和web.xml很重要,不建立的话,就报404,很重要,说三遍!!!!!!!!!!!!!!

 

然后,我将fbp-accont-fe放到本地的tomcat的webapp目录下。浏览器中即可访问相关vue页面了。

 

 

你可能感兴趣的:(vue,vue)