Vite + Electron 时,Electron 渲染空白,静态资源加载错误等问题解决

问题

如果在 electron 里直接引入 vite 打包后的东西,那么有些资源是请求不到的

这是我的引入方式

根据报错,我们来到 vite 打包后的路径看一看 ,修改一下 dist 里的文件路径试了一试

修改后的样子,发现是可以的了

原因分析

vite 打包后的资源都是以 / 开头的,前导斜杠表示您要从根目录链接文件, 具体可以看这里

解决办法

知道问题所在,那么就有两个方向了,要么配置 vite,要么配置 electron

这里觉得配置vite 是最方便的,查到了 vite 如何配置,在 vite.config.ts 中指定 base

之后在打包,在 electron 里试试,嗯正常了~

因为打包后的文件都不是以/开头的了

参考文章

1. vue3+vite的项目如何将打包后的绝对路径改为相对路径

相关推荐
原则猫8 小时前
UDP 到底怎么实现可靠的
前端
Java后端的Ai之路8 小时前
14、ReactJS - 路由(Router)
前端·react.js·状态模式
持敬chijing8 小时前
白盒测试与代码审计-js登录逆向实战
javascript·网络·安全·web安全·网络安全·网络攻击模型
优选资源分享9 小时前
PicGo v3.0.3 新版 | 开源免费图床工具
javascript·笔记·electron
裕晟资质规划9 小时前
三类涉密资质延续时限差异分析:军工60日与集成印制3个月的边界
java·服务器·前端·网络·安全
ShineWinsu10 小时前
对于JavaScript:JavaScript基础语法的解析
开发语言·前端·javascript·面试·web·基础语法·循环
月夏10 小时前
Vue3 转 React:18 项对照表 + 5 个必踩的坑(附 7 天上手路线)
前端
广州华水科技10 小时前
单北斗GNSS位移监测系统的应用与维护解析
前端
普通人610 小时前
php+html+canvas实现树状打开的结构
开发语言·javascript·html5·1024程序员节
梦曦i10 小时前
uni-storage 0.1.0 发布:TTL过期管理+多实例隔离
前端·storage·uni-app x