Electronを使う - Kの雑記

# GitHub, Incが開発したデスクトップアプリを作ることができる実行環境

# もともとはAtomの下地の実行環境として開発された

・Electronのインストール

$ npm install -g electron-prebuilt

$ electron -v

コマンドがない！調べると。。。

・npmのインストールが必要

・npmはNode.jsをインストールすれば入る。でNode.jsのインストール

Macにnodebrew（node.js, npm）をインストールする手順 - Qiita

ただし、これだけではPATHが通らないので、以下を参考にしてパスを通す

nodebrew で Mac の Node.js 環境をスッキリさせた - akiyoko blog

npmだけを使うなら以下でも良いかも（未検証）

[Mac] Node.js と npm をインストールする方法 [Homebrew] | CodeNote.net

やっとelectronがインストールできた。

#使う

WEB-DBの記事参考

・フォルダを作成（何処でも）

・以下のファイルを作成

-----------------------------------------

$ cat package.json
{
"name": "hello-electron",
"main": "main.js"
}

----------------------------------------

$ cat main.js
// Electron モジュールをロード
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}
   );
    //main.jsと同じディレクトリにあるindex.htmlを読み込む
    mainWindow.loadURL(
   'file://' + __dirname + '/index.html'
   );
    mainWindow.on('closed' , function(){
   mainWindow = null;
    });
});

----------------------------------------

$ cat index.html
<html>
    <head><title>Hello, World!</title></head>
    <body>
   <h1>Hello, World</h1>
   <ul>
        <li>Node.js <script>document.write(process.version)</script></li>
        <li>Electron <script>document.write(process.versions['electron'])</script></li>
   </ul>
    </body>
</html>

----------------------------------------

起動

$ electron .