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

问题

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

这是我的引入方式

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

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

原因分析

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

解决办法

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

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

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

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

参考文章

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

相关推荐
wordbaby4 小时前
TanStack Router 实战: 如何设置基础认证和受保护路由
前端
智算菩萨4 小时前
Anthropic Claude 4.5:AI分层编排的革命,成本、速度与能力的新平衡
前端·人工智能
程序员Agions4 小时前
程序员武学修炼手册(三):融会贯通——从写好代码到架构设计
前端·程序员·强化学习
zhouzhouya4 小时前
我和TRAE的这一年:从"看不懂"到"玩得转"的AI学习进化史
前端·程序员·trae
小则又沐风a4 小时前
数据结构->链表篇
前端·html
小王和八蛋4 小时前
前端存储与离线应用实战:Cookie、LocalStorage、PWA 及 Service Worker 核心知识点
前端·javascript
JarvanMo4 小时前
终极指南:在 Flutter 中通过 sign_in_with_apple 实现 Apple 登录
前端
Learner5 小时前
Python异常处理
java·前端·python
tao3556675 小时前
VS Code登录codex,报错(os error 10013)
java·服务器·前端
军军君015 小时前
Three.js基础功能学习七:加载器与管理器
开发语言·前端·javascript·学习·3d·threejs·三维