正文

Electron-使用Electron开发第一个应用

IP云
IP云V管理员/1 阅读
06/24
小程序：扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序

使用Electron开发第一个应用

Electron 应用的目录结构如下：

app/ 
├── package.json 
├── main.js 
└── index.html

新建一个app文件夹 将这三个文件都放在里面 
package.json的内容

{
"name" : "app",
"version" : "0.1.0",
"main" : "main.js"
}

  • 1
  • 2
  • 3
  • 4
  • 5

注意：如果 main 字段没有在 package.json 声明，Electron会优先加载 index.js

main.js的内容

var app = require('app'); 。
var BrowserWindow = require('browser-window');
var mainWindow = null;app.on('window-all-closed', function() {
if (process.platform != 'darwin') {
app.quit();
}
});app.on('ready', function() {
mainWindow = new BrowserWindow({width: 800, height: 600});
mainWindow.loadURL('file://' + __dirname + '/index.html');
mainWindow.on('closed', function() {
mainWindow = null;
});
});

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18

index.html的内容

<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

运行方法

直接打开electron.exe 将app文件夹拖进去就可以了 

或者在cmd窗口 输入electron.exe 参数是app文件夹所在的路径