我开始学习 Electron，至今所学

Source: Dev.to

对我而言，学习 JavaScript 最吸引人的地方在于它可以轻松地让人进入不同平台的应用开发。由于我主要在 Windows PC 上工作，我想创建一些个性化的应用来提升我的生产力。

为什么我没有选择原生开发而是使用 Electron？

答案很简单：我对 JavaScript 很熟悉。学习像 C 这样的新语言固然有好处，但我更倾向于先使用熟悉的东西，而不是让入门变得更困难。

我首先阅读了官方文档：. 在主页上可以看到典型的文件结构，其中包括 main.js、preload.js 和 index.html。我们通常关注的三个文件是：

main.js

main.js 是应用的核心。它运行在 主进程 中，负责 Node.js 集成、窗口创建以及整个应用的生命周期管理。

preload.js

preload.js 充当 UI（渲染进程）与主进程之间的桥梁。出于安全考虑，它向渲染进程暴露了受限且安全的 API。

renderer.js

renderer.js 运行在 渲染进程 中，操作 UI——本质上是“裸骨 UI 脚本”。如果使用像 React 这样的框架，这个文件往往是不必要的，因为 React 会自行打包 HTML、CSS 和 JavaScript。

搭建新项目

使用纯 HTML、CSS 和 JavaScript 与 Electron

你可以仅使用这三大 Web 基础来构建一个简单的 Electron 应用。最小化的设置可能如下所示：

在这个例子中，我省略了 preload.js，因为对于非常小的项目它是可选的。app 和 BrowserWindow 模块来自 Electron；app 控制应用的生命周期，而 BrowserWindow 用于创建和管理窗口。app.whenReady() 返回一个 Promise，在 Electron 完成初始化后解析。

使用 React（Vite）和 Electron

我更喜欢的工作流是将 React 与 Electron 结合。首先搭建一个 Vite 项目，然后把 Electron 作为开发依赖加入。为避免模块解析问题，将入口文件从 .js 重命名为 .cjs 并使用 CommonJS 语法。

这只是我目前所学的一个初步概览。随着我继续探索 Electron，我会继续分享我的见解。

Bye 👋