前言

先说几句废话，本人是一名 web 后端开发，主语言是 java，在学 Electron 之前，只会一点点 HTML和 JavaScript。本文讲的也是我学习 Electron 的过程，而非教程，请酌情参考。

Electron是什么

Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 Chromiu 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上运行的跨平台应用 macOS和Linux——不需要本地开发 经验。

前置准备

下面列举一下学 electron 之前需要掌握哪些技能：

• 独立开发一个页面的能力

  HTML+ JS + CSS，这是必备技能

• Node.js

  建议掌握。需要会安装 node 环境，剩下的 API 可以边用边学

因为 js 是弱类型语言，在缺少注释和约束的情况下，写时一时爽，维护。。。
而 *cript 的显式类型使代码可读性更高，更符合我使用 Java 时的习惯，所以又去学了 *cript。下面的讲解都基于 Electron + *cript，而非 Electron + JS，这个需要区分下。

开始学习

一阶段

Electron文档

按照官方文档学习，学习顺序如下：

1. 安装 Electron

2. Electron中的流程 部分

   了解 Electron 的流程模型（主进程和渲染器进程）、上下文隔离等。进程间通信可以看完教程部分再回来细看。

   在渲染器进程中无法使用 Node.js 和 Electron 的 API 是很难受的一点，下文细说。

3. 教程 部分

   只学习基本要求、创建您的个应用程序、使用预加载脚本，其他的先略过

二阶段

完成了一阶段的学习，还是不知道如何打包一个桌面端程序。此时就轮到 electron-vite 登场了。

electron-vite 是一个新型构建工具，旨在为 Electron ****提供更快、更精简的开发体验。

创建基础工程

electron-vite 提供了多种模板，因为我使用 *cript 开发，也不打算引入 vue 等框架，所以使用的是 vanilla-ts 模板。

				
	
	

		
相关文章