使用 Electron 构建一个简单的桌面应用程序

使用 Electron 可以轻松创建桌面应用程序。你可以构建可在任何操作系统中运行的跨平台应用程序。在本篇文章中，我们将使用Vanilla JavaScript项目并将其转换为Electron 应用程序。如果你了解 Vanilla JavaScript，请跟随我一起完成本篇内容。

先决条件：

1. 在你的计算机上安装Node.js。

2. 有一个以前在 Vanilla JavaScript 中的项目示例（todo-list、notes-app、tic-tac-toe 等）

使用选举构建桌面应用程序

首先，在终端中写入以下内容，替换​my-app​，随便取什么名字。

此命令将为我们的 Electron 应用程序生成结构。

然后，输入 ​cd​和 ​name of your project​

在 src 文件夹中，你将找到一个 ​index.html​, ​style.css​， 和 ​index.js​文件。

文件名为​ index.js​ 包含设置​my-app​。我们必须对其进行一些更改。

这种配置允许 Electron 与 Node.js 并带有不同的模块。

现在您可以将文件复制到​ src​文件夹。

请记住，主 HTML 文件必须命名为 ​index.html​，因为 ​mainWindow​ 函数将使用该文件来启动应用程序。

你还可以更改起始文件的名称而不是​index.html​。请记住，你可以替换 HTML 和 CSS 文件，但不要更改​index.js​文件。因为该文件是我们应用程序的核心。

现在你的项目准备好运行，输入​npm start​。

你必须在应用程序运行时看到一个 Chromium 窗口弹出窗口。

在运行之前 ​build​ 命令检查一切正常。

如果你想对你的应用程序进行一些调整，现在是时候了。接下来，在你的终端中输入​npm run make​。

此过程完成后，你将看到一个名为“out”的新文件夹。

现在你的应用程序已准备好安装在你的机器上。

进入目录​./out/make/squirrel.[system]​并运行​ setup.exe​ 文件。

结束语

单击你的桌面窗口并访问你全新的桌面应用程序！

到这里，你现在已经使用 Electron 构建了快速简便的桌面应用程序！

我希望这篇文章对大家能有所用。感谢阅读。