开源项目 `run-electron` 使用教程

贺晔音

于 2024-09-04 07:20:44 发布

阅读量928

点赞数 22

本文链接：https://blog.csdn.net/gitblog_00340/article/details/141878848

版权

开源项目 `run-electron` 使用教程

run-electronRun Electron without all the junk terminal output项目地址:https://gitcode.com/gh_mirrors/ru/run-electron

项目介绍

run-electron 是一个用于快速启动 Electron 应用的工具，由 Sindre Sorhus 开发。它简化了 Electron 应用的启动流程，使得开发者可以更快速地运行和调试 Electron 应用。

项目快速启动

安装

首先，确保你已经安装了 Node.js 和 npm。然后，通过以下命令安装 run-electron：

npm install --save-dev run-electron

配置

在你的项目根目录下创建一个 package.json 文件，并添加以下内容：

{
  "name": "my-electron-app",
  "version": "1.0.0",
  "description": "Hello World",
  "main": "main.js",
  "scripts": {
    "start": "run-electron"
  },
  "author": "Jane Doe",
  "license": "MIT",
  "devDependencies": {
    "run-electron": "^1.0.0"
  }
}

创建主进程文件

在项目根目录下创建一个 main.js 文件，并添加以下内容：

const { app, BrowserWindow } = require('electron');

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  });

  win.loadFile('index.html');
}

app.whenReady().then(createWindow);

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

创建渲染进程文件

在项目根目录下创建一个 index.html 文件，并添加以下内容：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Hello World</title>
</head>
<body>
  <h1>Hello from Electron!</h1>
</body>
</html>