Electron 是一個可以用HTML CSS JS 來開發跨平台桌面應用的框架
必備 module
electron 測試和使用
electron-packager 打包成 exe 執行檔
使用指令進行測試和打包
package.json
{
"main": "main.js",
"name": "electron-test",
"author": "user",
"contributors": [],
"dependencies": {
"electron": "1.7.9",
"electron-packager": "9.1.0"
},
"scripts": {
"electron": "electron main.js",
"package": "electron-packager . test --platform=win32 --arch=x64 --version=1.7.9 --overwrite"
}
}
main裡的 main.js 為應用程式進入點
會在這裡做一些基本的設定
使用
npm install ->引入需要的module
npm run electron ->測試開啟
npm run package ->打包成 exe
main.js
const { app, BrowserWindow ,Menu} = require( 'electron' );
const path = require( 'path' );
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow();
// 讀取主要的html
mainWindow.loadURL( path.join('file://', __dirname, 'index.html'));
// 開啟debug tool
mainWindow.webContents.openDevTools({
detach: true,
});
});
選擇html 開啟
index.html
<!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>TODO write content</div>
</body>
</html>
沒有留言:
張貼留言