当前位置: 首页 > news >正文

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

问题

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

在这里插入图片描述

这是我的引入方式
在这里插入图片描述

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

在这里插入图片描述
修改后的样子,发现是可以的了
在这里插入图片描述

原因分析

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

在这里插入图片描述

解决办法

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

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

在这里插入图片描述
之后在打包,在 electron 里试试,嗯正常了~

在这里插入图片描述
因为打包后的文件都不是以/开头的了

在这里插入图片描述

参考文章

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

相关文章:

  • 华为SMU02B1智能通信电源监控单元模块简介
  • LabVIEW机械手视觉引导系统
  • RedisTemplate操作ZSet的API
  • C/C++语言基础--从C到C++的不同(上)
  • 面试题总结(三) -- 内存管理篇
  • 微信小程序----日期时间选择器(自定义时间精确到分秒)
  • 应用层协议HTTP介绍
  • PostgreSQL - tutorial
  • 前端基础知识+算法(一)
  • Java 枚举 新特性
  • SEAFARING靶场漏洞攻略
  • Playwright与Selenium的对比:谁是更适合你的自动化测试工具?
  • 随想录笔记-二叉树练习题
  • 基于微信小程序的宠物之家的设计与实现
  • 基于R语言的统计分析基础:使用SQL语句操作数据集
  • Gitlab实现多项目触发式自动CICD
  • 2024年华为9月4日秋招笔试真题题解
  • 多态(下)【C++】
  • HarmonyOS开发之模拟器地图点击无效问题
  • 实现实时Web应用,使用AJAX轮询、WebSocket、还是SSE呢??
  • 广州地铁十一号线赤沙车辆段工程高坠事故调查报告公布:1人重伤且漏报
  • 金价大跌!足金饰品每克一夜便宜14元,涨势是否已终结?
  • 第二期人工智能能力建设研讨班在京开班,近40国和区域组织代表参加
  • 中美瑞士会谈后中国会否取消矿产出口许可要求?外交部回应
  • 泽连斯基表示将在土耳其“等候”普京
  • 默茨首访聚焦欧洲,欲推欧洲防务自主