vite+vant+vue打包部署到tomcat静态资源找不到页面空白问题

最新推荐文章于 2023-08-16 17:03:56 发布
最新推荐文章于 2023-08-16 17:03:56 发布
阅读量2.5k 收藏 2
点赞数 2
文章标签： vue.js tomcat 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44132285/article/details/121874987
版权

1.首先要解决的是静态资源找不到的问题
需要在vite.config.js里面配置base的根目录的路径 具体操作如下：
在这里插入图片描述
此时配置完成之后打包放置到tomcat上静态资源加载成功但是页面还是空白

2.需要配置路由base

vite是通过传参的方式配置base的
在这里插入图片描述
此时配置完base后重新打包 启动tomcat 页面出来了 注意：此时的base配置的名称要和你打包后放置到tomcat webapps里面的文件名要对应 比如打包生成的是dist目录你要改成mobile目录

愤怒的小郭
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue2/3解决项目打包后本地图片等资源找不到的问题
weixin_68658847的博客
05-23 1799
vue2/3解决项目打包后本地图片等资源找不到的问题
vue cli3.0打包上线静态资源找不到路径的解决操作
10-15
主要介绍了vue cli3.0打包上线静态资源找不到路径的解决操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
基于vite+vuex+vue-router+vant3.0的h5应用框架，开箱即用
06-21
基于vite+vuex+vue-router+vant3.0的h5应用框架，开箱即用
将vite+vue3项目打包并部署到本地的tomcat服务器
m0_51758445的博客
11-03 5350
将vite+vue3项目打包并部署到本地的tomcat服务器
Vite打包静态资源无法加载问题
weixin_48328458的博客
03-28 1922
问题：本地npm run dev正常，build 之后preview和部署到github pages之后Failed to load resource:404。场景：开发前期使用静态资源作假数据，含嵌套父子组件传值。这部分尝试用引入方法时也出现加载不出来但不报错的情况。1.页面需要直接显示的部分尽量用标签直接引入。2. 文件中各处使用引入的方式使用。项目：Vue3 + Vite。
vue3+vite打包后静态资源不显示
Mjxiaomihu的博客
01-04 6003
vue3+vite打包后静态资源不显示
Vue打包发布用tomcat运行起来后无法访问，出现空白页问题的解决方案
互联网的修罗场
02-22 5932
现象 使用npm run build发布打包vue前端项目http://localhost:8080/xxx （webapps下的发布的文件夹名）出现空白页，使用F12查看如下图： 原因 由于webpack打包引入css js等文件路径为绝对路径，因此导致tomcat等web server相对路径访问不到而出现空白页和ERR_ABORTED错误。 解决 1.在build/webpac...
tomcat部署vue前端项目
m0_67392182的博客
05-15 4089
Tomcat建立文件夹 1.在webapps文件夹下建立JL文件夹 2.将vue项目中打包好的dist中的static和index.html复制到这个文件夹下 Vue项目修改请求的公共路径 1.vue.config.js修改打包时的公共路径 publicPath: process.env.NODE_ENV === "production" ? "/JL" : "/" Vue项目修改路由配置 base:process.env.VUE_APP_BASE_Title, //-------.
【Web服务器】Tomcat的部署
一个萌新的博客
06-05 9634
主要介绍了tomcat的概念、jdk安装配置、tomcat安装配置、虚拟主机配置、多实例部署
vue3+vite2+ts+vant3 项目demo
04-16
此项目 按照大佬文章 一步步学习搭建 https://juejin.cn/post/7036745610954801166?share_token=5dd94aae-bed2-4733-93ac-306118376443；感谢大佬
解决Vue在Tomcat8下部署页面不加载的问题
01-19
最新的项目刚刚用上Vue，遇到很多问题，在Tomcat下部署时出现了页面空白。 问题：路由 mode history 模式在 dev 模式下没有问题，在 build 模式页面空白，但静态资源能正常引用 原因：部署在Tomcat上时并没有在根目录上，而是放置在了子文件夹下面，router 无法找到路径中的组件，所以也就无法渲染了  解决：修改 router 下 index.js  以上这篇解决Vue在Tomcat8下部署页面不加载的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持软件开发网。
vue3+vite+vant搭建好的基础框架
10-12
1.已按需引入vant3 UI组件库 2.支持rem适配,375和750设计稿 3.已完成axios封装 4.已完成API请求统一管理 5.已实现路由自动注册 6.已实现vuex状态管理模块化 7.顶部导航栏二次封装 8.文件上传组件二次封装
vue3-vite-ts-Vant：vue3 + vite + ts + Vant + vuex +路由器
03-04
Vue3-Vite-TS-Vant 是一个现代前端开发框架的集成，主要采用了 Vue.js 的最新版本 3，搭配了 Vite 构建工具，TypeScript 作为编程语言，Vant UI 库，Vuex 状态管理，以及 Vue Router 路由系统。这个组合为开发者提供...
将vue 项目build 放入tomcat 静态资源访问不到的问题
weixin_44076260的博客
10-24 1836
1.我今天想把我写的前端框架放到tomcat里面运行一下，发现静态资源居然访问不到，如下图所示： 2.解决办法：
tomcat启动找不到静态文件404，访问 CSS和 js 404解决办法
baidu_32078207的博客
03-09 1065
第一种 修改头 例如 127.0.0.1 修改为 loaclhost 修改 hots 文件 c:/windows/system32/drivers/etc 加上 127.0.0.1 loaclhost loaclhost 127.0.0.1 CMD 命令 netsh int ipv6 set prefix ::/96 50 0 netsh int ipv6 set prefix ::ffff:0:0/96 40 1 netsh int ipv6 set prefix 2002::/16 30 2 nets
[vite] 项目打包后页面空白,配置了base后也不生效
jinwenshuo2007的博客
08-16 3607
vite打包项目后页面空白,配置了base和history也没用的，看这里
使用vite打包时候遇到的坑
weixin_42369612的博客
08-15 9111
使用vite打包时候遇到的坑
vite项目yarn build打包后，index.html打不开,原因是公共基础路径base的配置问题
Frank_colo的博客
06-13 1400
1 vite.production.ts文件中的base为 /3 src的路径是绝对路径 /，因该是相对路径 ./2 打开dist包，打开index.html。6 重新打包，src的路径变成了 ./4 启动本地的开发服务器，没找到。5 将base 改为 ./
vite+vant+vue2
最新发布
10-11
Vue 2 是一种流行的 JavaScript 框架，而 Vite 是一个基于现代浏览器的前端构建工具。Vite 针对 Vue 3 进行了优化，但也可以用于 Vue 2 项目。 如果你想在 Vue 2 项目中使用 Vite，可以按照以下步骤进行设置： 1. ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值