Electron 建立第一个应用

超、凢脫俗 2022-04-23 05:06 315阅读 0赞

安装node.js 这个不说 官网 下一步下一步就是了

在命令行运行 node —version 有出现版本号就表示成功

然后安装electron

node install electron -g 表示全局安装

安装完成后 输入electron -v 有出现版本号就说明OK

新建目录（自定义）

然后建立3个文件：package.json index.js index.html

index.html

  1. <!DOCTYPE html>
  2. <head>
  3.     <title>Hello World</title>
  4.     <meta charset='utf-8'>
  5. </head>
  6. <div>Hello World</div>
  7. </html>

index.js

  1. const { app, BrowserWindow } = require('electron');
  3. function createBrowser() {
  4.     win = new BrowserWindow({ width: 800, height: 600 });
  5.     win.loadFile('index.html');
  6.     win.on('closed', () => {
  7.         console.log('close');
  8.         win = null;
  9.     });
  10. }
  12. app.on('ready', createBrowser);

其中 在createBrowser函数中添加： win.webContents.openDevTools();可将调试控制台显示在页面上

package.json

  1. {
  2.     "name":"first",
  3.     "version":"1.0.0",
  4.     "main":"index.js"
  5. }

保存后 在命令行下 切换至代码所在目录 运行 electron . 这个’.’号表示当前目录

搞定

发表评论

表情：
评论列表 （有 0 条评论，315人围观）

还没有评论，来说两句吧...

相关阅读

    相关 第一个php应用

    php php是世界上最好的语言 吗？ 它是一种超文本预处理器，内嵌在html中的脚本语言。 对于个人或者小企业的小型web项目来讲，php有着难以抵挡的优势：简

    小鱼儿小鱼儿/ 0 赞/ 31 阅读

    相关 第一个Vue应用

    不管我们学习哪种语言，我们第一个写的估计就是Hello World了，这里我们也是先通过一个简单的html代码开始，来对Vue有一个直观的感觉。 <html> <he

    电玩女神电玩女神/ 0 赞/ 342 阅读