Electron 开发环境搭建

1. 安装 Node.js

首先，我们需要确保你已经安装了 Node.js。Electron 是基于 Node.js 和 Chromium 浏览器引擎构建的。如果你还没有安装 Node.js，请前往 Node.js 官方网站 下载并安装与你操作系统匹配的最新稳定版 Node.js。安装完成后，你可以在终端或命令提示符中运行以下命令来确认 Node.js 和 npm（Node 包管理器）已经成功安装且版本正常：

node -v
npm -v

2. 初始化 Electron 项目

现在，我们来创建一个新的工作目录，例如 my-electron-app。在终端中执行以下命令：

mkdir my-electron-app
cd my-electron-app
npm init -y

这将初始化一个新的 Node.js 项目，并自动生成一个 package.json 文件。

3. 安装 Electron

继续在终端中执行以下命令，安装 Electron：

npm install electron

4. 创建主进程窗口

在项目根目录下创建一个名为 main.js 的文件，作为 Electron 的主进程。在 main.js 中，你可以使用 Electron 提供的 API 来创建窗口、加载页面等。以下是一个简单的示例：

// main.js
const { app, BrowserWindow } = require('electron');

app.on('ready', () => {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true, // 允许在渲染进程中使用 Node.js
    },
  });

  // 加载你的 HTML 文件
  mainWindow.loadFile('index.html');
});

5. 创建渲染进程

在项目根目录下创建一个名为 index.html 的文件，作为 Electron 的渲染进程。在这个文件中，你可以编写你的应用界面，使用 HTML、CSS 和 JavaScript。

6. 运行应用

在终端中运行以下命令，启动你的 Electron 应用：

electron .

这将打开一个 Electron 窗口，加载 index.html 中的内容。

7. 更多功能

当然，这只是一个简单的入门示例。你还可以添加更多功能，如菜单、对话框、文件操作等。如果你想开发一个 Markdown 编辑器，可以在渲染进程中使用一些流行的 Markdown 渲染库，例如 marked。

祝你在 Electron 开发中玩得愉快！如果有其他问题，随时告诉我哦。🚀

（Electron 官网）