首页 > 科技 >

🚀 Electron快速入门_electron教程

发布时间:2025-02-28 00:06:31来源:

💡 什么是Electron?

Electron 是一个用于构建跨平台桌面应用程序的开源框架。它结合了 Chromium 渲染引擎和 Node.js 运行时环境,使得开发者可以使用 HTML, CSS 和 JavaScript 来开发应用。这意味着你可以用熟悉的 Web 技术来创建功能强大的桌面软件。

🔧 安装Electron

首先,你需要安装 Node.js。访问官网下载并安装最新版本。接着,在你的项目目录中打开命令行工具,运行以下命令安装 Electron:

```bash

npm install electron --save-dev

```

🎨 创建第一个Electron应用

接下来,让我们创建一个简单的应用。在项目根目录下创建一个名为 `main.js` 的文件,并添加以下代码:

```javascript

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` 文件,

```html

我的第一个Electron应用

Hello World!

```

🏃‍♂️ 运行你的应用

在命令行中输入以下命令启动应用:

```bash

npx electron .

```

📚 学习更多

现在你已经成功创建了一个基本的 Electron 应用!如果你想了解更多高级功能,可以查阅官方文档或参加一些在线课程。希望这篇教程对你有所帮助!🚀

免责声明:本答案或内容为用户上传,不代表本网观点。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。 如遇侵权请及时联系本站删除。