Electronのインストール
まずはElectronをインストールします。 npm init
で package.json
を作り、 npm install
でElectronをインストールします。
$ npm init
$ npm install --save-dev electron
Hello, World!プロジェクト
Hello, World!を表示するだけのアプリケーションを作ります。
index.js
JavaScriptコードでは BrowserWindow
のインスタンスを作り、index.html
をロードします。
const electron = require('electron');
const createWindow = () => {
const win = new electron.BrowserWindow({
width: 1024,
height: 768,
webPreferences: {
nodeIntegration: true
}
});
win.loadFile('index.html');
}
electron.app.on('ready', createWindow)
index.html
<html>
<body>
<h1>Hello, World!</h1>
</body>
</html>
package.json
package.json
ではstartスクリプトに electron
コマンドを指定します。
{
"name": "electron-example",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "./node_modules/.bin/electron ."
},
"author": "",
"license": "ISC",
"devDependencies": {
"electron": "^5.0.6"
}
}
動作確認
次のコマンドでアプリケーションが起動します。
$ npm start