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

问题

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

这是我的引入方式

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

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

原因分析

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

解决办法

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

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

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

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

参考文章

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

相关推荐
小村儿13 小时前
连载10-Sub-agents 深度解析:从源码理解 Claude Code 的分身术
前端·后端·ai编程
5008413 小时前
把 FlashAttention 讲清楚
flutter·electron·wpf
IT_陈寒13 小时前
Vite动态导入把我坑惨了,原来要这样用才对
前端·人工智能·后端
DFT计算杂谈13 小时前
KPROJ编译教程
java·前端·python·算法·conda
觅_13 小时前
前端学习后端的时候 选择一个技术
前端·学习
独泪了无痕13 小时前
CryptoJS:数据安全的JavaScript加密利器
前端·vue.js·node.js
i_am_a_div_日积月累_14 小时前
1.创建electron项目
electron
发现一只大呆瓜14 小时前
一文搞懂 Vite 处理CommonJS包、按需编译逻辑及 Rollup 插件兼容规则
前端
Edwardwu14 小时前
写了个y-mxgraph:给 draw.io 接上了 Yjs,顺便解决了部署在 iframe 里的一堆问题
前端·typescript
其实防守也摸鱼14 小时前
软件安全与漏洞--软件安全编码
java·前端·网络·安全·网络安全·web·工具