使用Tomcat发布vue

最新推荐文章于 2024-06-03 15:47:47 发布
最新推荐文章于 2024-06-03 15:47:47 发布
阅读量510 收藏
点赞数
文章标签： vue tomcat
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37916752/article/details/108399679
版权

使用Tomcat发布vue

在这里插入图片描述
在vue中，可以自定义访问后端接口的路径，通过通过main指定url,
但是当把vue打包到tomcat下，tomcat设置不同的port时，vue中又该如何让设置访问接口的参数

1、当Vue项目完成的时候，就需要部署到服务器上，首先，我们要修改config/index.js文件

在这里插入图片描述``
assetsPublicPath: '/' 改为 assetsPublicPath: './'
#注意，这个文件要改两处assetsPublicPath
2.运行 npm run build ,把编译好的dist目录打包，然后上传到服务器
3、下载tomcat包并解压，然后把vue项目的dist压缩包放在webapps目录下，并解压

小悠_の
关注
vue项目打包部署到tomcat（详细）
蜗牛~~
06-21 5852
hash路由模式打包部署到tomcat 1、修改config/index.js文件下的assetsPublicPath为'./' 2、修改router文件夹下index.js添加 base: ‘/文件夹名称/’ （例如：yuncheng，可以自己随意设置） 3、在tomcat下webapps里面新建一个文件夹，名称是之前配置时设置的名称（yuncheng） 4、将自己打包的dist文件夹的内容放进tomcat下的webapps的yuncheng文件夹下 注意：2.3.4可以简化为：在...
手把手教你如何Vue项目打包dist文件并Tomcat发布【超级详细】
**My Coding Family**
03-24 9194
零基础带你入门Vue项目打包部署到Linux服务器，一条龙服务，只为不远千里把你教会。
Tomcat发布Vue打包项目
qq_46178473的博客
04-18 909
Vue项目打包： 我的Vue项目创建用得是vue init webpack myapp命令，项目名为：myapp 第一步 到config目录下，找到并打开index.js文件，将assetsPublicPath字段的路径修改为./。/表示根目录，./表示当前目录，../表示父级目录。 同时，将build配置项下的assetsPublicPath属性改为：（空） 然后在命令行输入：npm run build 打包成功后会出现一个dist文件夹 检查打包后的项目能否正常运行 在dist文件夹下的
tomcat部署前端vue项目（项目上线具体操作）
qq_45349018的博客
02-16 6878
前端Vue项目上线部署操作。
tomcat部署vue项目（成功版）
凤舞九天的博客
12-01 1万+
1、tomcat介绍 2、下载tomcat 3、启动tomcat 4、打包vue项目 5、tomcat部署vue项目 1、tomcat简介 tomcat 是免费的web服务器。不使用tomcat也可以打开html页面，但是可以在浏览器的地址里看到file:d:/test.html这样的格式，是通过打开本地文件的形式打开的。使用tomcat后，可以这样127.0.0.1:8080/test.html像访问一个网站似的，访问一个html文件了。 2、下载tomcat https:/...
Tomcat上部署vue项目（详细）包括安装，配置vue的history模式刷新404问题
最新发布
Zhangwei557的博客
06-03 1187
2、解压tomcat文件,可以通过快捷键(command+shift+G)把它放入/Library(资源库中)在 Tomcat 下 webapps→test（test项目文件名）→创建WEB-INF→创建web.xml。6、npm run build后生成dist文件，放到tomcat中webapps中，以labo为例。5、开启Tomcat，终端输入sudo sh ./startup.sh，输完回车。至此两个问题解决完成！4、授权bin目录下的所有操作：终端输入。3、在bin目录下打开终端。
vue项目使用tomcat部署
hqzxsc2006的专栏
07-25 3005
1、vue打包的静态文件夹dist传到tomcat的webapps目录下 2、找到tomcat的conf文件下的server.xml，配置静态服务,找到HOST标签： 这里的配置为 增加context标签行，可以直接跳转到dist目录下 <Host name="localhost" appBase="webapps" unpackWARs="true" autoD...
Vue部署到tomcat
李木有大本事的博客
09-25 411
Vue部署到tomcat 前置条件：history模式 根路径：/xxx 解决： 1.修改打包配置文件，通常在config/index.js，将assetsPublicPath: '/'改为assetsPublicPath: '/xxx/' 2.进入tomcat/webapps目录创建文件夹xxx，将打包好的dist文件夹中的所有文件复制到xxx。此时访问即可正常访问，但是页面刷新时会报404，继续下面操作 3.在该文件夹下创建WEB-INF文件夹，创建web.xml文件，其内容如下 <?xm
Vue项目打包发布到tomcat
kerryqpw的博客
04-06 1245
Vue项目打包发布到tomcat npm run build Nodejs服务器安装: npm install -g serve 1、本地测试运行打包的vue： serve dist 访问：http:localhost:5000 打包部署到tomcat服务器 修改配置：webpack.prod.conf.js ...
记录:centos7.6之Tomcat8.5发布dist包vue页面缓存问题...【解决方案】
**My Coding Family**
05-25 588
记录:centos7.6之Tomcat8.5发布dist包vue页面缓存问题...【解决方案】
tomcat跨域访问
08-12
在开发vue时，使和vue-cli开发时，后台为tomcat,因此需要配置tomcat支持跨域请求，这样可以在vue 开发阶段调用后台接口。
tomcat部署springboot+vue.doc
04-22
web项目是企业以及政府部门最常用的工具，政府门户网站，企业官网等基本都是web项目，web项目所使用的技术也是在不断的更新，前几年的技术基本上都是jsp+ssh，到后来的h5+ssh，h5+spring+mybatis，目前使用最多的是springboot+VUE前后端分离的技术，本文主要介绍了springboot+VUE怎么使用tomcat去部署
发布Vue项目到tomcat
ytangdigl的博客
01-05 3651
1、使用npm run build 命令 将vue项目打包，运行后会生成dist打包文件(最好是将dist重命名为你的项目名)，将这个文件拷贝到tomcat的webapps下，启动tomcat,就可以访问了。
【tomcat】部署vue项目
lorogy的博客
07-17 1262
vue项目打包为dist 在tomcat的webapps下新建文件夹，比如myvue 将dist内的index.html和static上传到myvue目录下 浏览器输入http://[ip]:[port]/myvue即可访问
怎么把Vue项目发布到Tomcat上
热门推荐
潇兮水寒的博客
12-02 1万+
  前言：       好久没学的Vue，最近又接着学了，好不容易使用vuecli写了一下Demo想在tomcat运行，但是页面是空白，打开一看，发现所有的JS全部都是404了。 我的操作顺序这样的： 1.打开终端 执行 npm run build （node编译打包命令，最后生成的网页都在工程的dist文件夹下） 2.拷贝./dist文件夹的所有网页相关文件 3.进行我的T...
使用tomcat部署vue项目
emgexgb_sef的博客
08-28 4458
在bin目录下，启动tomcat就可以了。webapp下新增vue文件夹。
tomcat部署vue项目
atongmu09的博客
01-10 3401
1.找到config&gt;index.js 修改assetsPublicPath。 2.tomcat目录中的conf&gt;server.xml 添加新端口 &lt;Service name="Catalina2"&gt; &lt;Connector port="8088" protocol="HTTP/1.1" connectionTimeout...
VUE前端打包发布到tomcat
weixin_42587270的博客
05-23 1727
整体思路： 后端和前端都打包用tomcat部署。部署在同一个tomcat下的webapp目录下。这样不会出现跨域问题。开发时前后端分离开发，为了解决跨域，在vite.config.js中会配置proxy反向代理，但是打包发布的时候，这个代理时不生效的，需要在web容器中配置代理。 这里前后端都用同一个tomcat发布的话，不存在跨域，就不用配置代理了。 1、项目打包之前，需要调整一点配置。假如前端访问地址时 127.0.0.1:8081/glui,这样项目访问后台接口时，访问的地址就会是127.0.0.1:
vue项目部署到Tomcat中
qq810646038的博客
03-13 638
本人vue小白，在pc写好页面，想部署到tomcat服务器中 1.首先用vue-cli生成发布代码，现在有vue ui工具，很方便 2.在项目文件夹中多了个dist文件夹，里面就是要放到服务器的东东了 3.在tomcat/webapps文件夹内，新建文件夹（名字为项目名称），这里就取名activity 4.浏览器输入http://localhost:8080/activity/访问，本以为可以...
Vue项目打包与Tomcat部署实战解析
本文主要介绍使用vue-cli（simple）搭建的项目如何进行打包和发布到Tomcat服务器。在过程中可能会遇到的问题包括：打包后项目在服务器上访问显示空白页，以及静态资源加载失败导致404错误。以下将详细解释这些步骤和...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值