electron 相关#

问题 1#

使用electron_forge + vite + typescript + react创建项目
本地开发一切正常
打包后运行.exe文件报错

问题原因：electron_forge的默认配置有问题Vite不能像webpack一样处理导入，修改main.ts即可

// old
if (require("electron-squirrel-startup")) {
  app.quit();
}

// new
// @ts-expect-error -> In vite there are no types for the following line. Electron forge error
import started from "electron-squirrel-startup";

// Handle creating/removing shortcuts on Windows when installing/uninstalling.
if (started) {
  app.quit();
}

问题 2#

electron_forge + vite + typescript + react创建的项目集成了react-router-dom后
打包运行.exe文件，页面白屏控制台无报错
electron相关的通信一切正常

问题原因：react-router-dom的BrowserRouter需要服务器的支持，electron建议使用HashRouter

• BrowserRouter
  • 路径管理：BrowserRouter 使用 HTML5 的 History API 来管理路径。这意味着 URL 的路径部分会被用来表示应用的状态。
  • URL 形式：URL 形式为 http://example.com/path。
  • 依赖服务器：BrowserRouter 需要服务器支持，因为每次刷新页面或直接访问某个路径时，服务器需要返回相同的入口文件（通常是 index.html）。
• HashRouter
  • 路径管理：HashRouter 使用 URL 的哈希部分（即 # 后面的部分）来管理路径。这意味着路径变化不会触发浏览器向服务器发送请求。
  • URL 形式：URL 形式为 http://example.com/#/path。
  • 不依赖服务器：HashRouter 不需要服务器支持，因为路径变化不会影响服务器的行为。

问题 3#

使用pnpm install --save-d electron安装electron后未执行electron的install.js

问题原因: pnpm会自动阻止运行构建脚本，除非明确允许它们

# 主动运行构建脚本，勾选要安装的脚本
pnpm approve-builds