開発

electron-connectでLivereloadができなかった件

忙しくツール作成の時間が作れず、師走を実感してしまう今日此の頃。
環境を整えつつコードもいじっているのですがmobaXterm便利ですね。
VNCの接続が何故か切れてしまうので試しに入れてみたらものすごい快適です。

さて、色々覚えながらなので結果がすぐにわかるようにコードをセーブアンドリロードしながらやっているのですがこれでは効率が悪い。調べてみると自動でリロードしてくれる仕組みがあるとのことで早速electron-connectを導入してみました。

で、ググって設定をしてみたのですがうまく動いてくれない。
大体ネットで得られるのはこのような設定。

main.js

...
let mainWindow
let client = require('electron-connect').client
...
let createWindow = () => {
...
  // For electron-connect
  client.create(mainWindow);
...

index.html

<head>
...
  <script>require('electron-connect').client.create()</script>
</head>

gulpfile.js

var electron = require('electron-connect').server.create();
...
gulp.task('server', function(){
  electron.start;
  gulp.watch(['*.js'], electron.restart);
  gulp.watch(['*.html'], electron.reload);
...

これでgulp serverとやっても何もおこならない。
そもそもどういう動作になるのか想定結果がわかってないので困りました。
electron.startが恐らくブラウザ起動してくれるのだと思ったのですが画面に変化がないので、VNCやmobaXtermがおかしいのかと調べてみたがどうもそうではないらしい。

そういえばelectronを立ち上げるときに引数を指定していたと思い出してディレクトリ情報を渡してみました

こんな感じに修正。

gulpfile.js

var electron = require('electron-connect').server.create();
...
gulp.task('server', function(){
  electron.start('.');
  gulp.watch(['*.js'], electron.restart);
  gulp.watch(['*.html'], electron.reload);
...

そして再度gulp serverするとelectronが立ち上がってきました。
jsやhtmlを変更すると最新の状態にリロードや再起動してくれます。
うーむ、electronのバージョンで動きが違うのでしょうか?v1.4.8ではこのような設定で動きました。
色々試してみるとclient.create(mainWindow);の記述はなくても動きました。

追記

gulpからFuseBoxに移行しました。ホットリロードはこちらが簡単でした。

管理人

Recent Posts

RustでSOLID原則について考える

binllionを作っていて1…

2か月 ago

[binllion] clippyを使ってコードを改善する

ここままでエディターとしての最…

3か月 ago

[binllion] データのエクスポート機能を追加する

インポートとくればエクスポート…

3か月 ago

[binllion] データのインポート機能を追加する

データの編集機能の開発も終えた…

3か月 ago

[binllion] 編集用バッファに削除機能を追加する

上書き、挿入、とくれば削除も必…

3か月 ago

[binllion] 編集用バッファに挿入機能を追加する

上書き、とくれば挿入も必要でし…

4か月 ago