goemon
goemon は mattn さんが作った Web 用の開発ツール。 Go 言語製。
ファイルが更新したタイミングでコマンドを実行して、開発サーバを再起動したり livereload を実行したりできるらしい。
設定が YAML で簡単にいじれたり、特定のビルドシステムとかに依存しない感じがよさそうなので試す。自分が普段使っている Node.js と組み合わせてみる。
インストール
Go 言語製なので go get
で入る。もし GOROOT
を設定していなければ設定する必要がある。最初レポジトリの URL をただ指定したら、コマンドがインストールされなくて1分ぐらいハマった。 README に書かれた URL を指定すればよかった。
$ go get github.com/mattn/goemon/cmd/goemon
babel
と組み合わせるので、そっちもインストール。
$ npm install babel
設定
設定は goemon.yml
に書くらしい。 goemon -g
で標準出力にはき出されるので最初はそれを使う。
$ goemon -g > goemon.yml
できた goemon.yml
を自分の環境に合わせて書き換える。今回はこんな感じ。
livereload: :8001
tasks:
- match: './src/*.js'
commands:
- node_modules/.bin/babel src --out-dir lib
- :restart
- :livereload /
- match: './assets/*.txt'
commands:
- :livereload /
サーバ
Express や connect を使った Web サーバの場合、connect-livereload
を使うと自動でリロードさせることができた。
connect-livereload
に渡したポートと goemon.yml
のポートを合わせる。
import path from 'path';
import livereload from 'connect-livereload';
import express from 'express';
const app = express();
app.use(livereload({ port: 8001 }));
app.get('/', (req, res) => {
var assetsDir = path.resolve(__dirname, '..', 'assets' + req.url);
var files = fs.readdirSync(assetsDir);
res.send(`<html>Hello, World!<br>${ files.join('<br>') }</html>`);
});
app.listen(8000);
src/server.js
として保存。
実際に動かす
goemon ${ 起動コマンド }
で起動できる。
$ babel src --out-dir lib
$ goemon node lib/server
localhost:8000
にアクセスすると、Hello, World!
と表示される。 DevTools の Network で見るとちゃんと livereload.js も読み込まれている。
試しに Hello, World!
の部分を Hello, Chicken!
に変えて保存すると、ワンテンポおいて画面が更新された。
また assets
フォルダを作成し、中に拡張子が .txt
なファイルを作成・削除すると、同じように自動で更新されファイル名が表示される。
色々やってみた感想
- コマンドが停止(?)すると自動でもう一度実行してくれる
- 起動のタイミングで失敗すると何度も再起動し続けて、ちょっと慌てる
goemon.yml
を更新すると自動で設定を読み直してくれるっぽい- 便利
gulp
とかでやるsrc/**/*.js
みたいな指定をすると反応してくれない- ソースコードを軽く読んだ限りできそう
- なにかが間違っているのか、バグなのか
- 環境変数を設定できると便利そう
node_modules/.bin
をPATH
に加えたり
goemon.yml
以外の設定ファイルも読めないのかな- Web ブラウザの確認だけじゃなくてテストにも使えそう
- その場合設定ファイルは分けたほうが良さそう
- 実際に使う場合は
gulp-changed
と組み合わせたりって感じだろうか - 特定のビルドシステムに依存しないと、やっぱり楽そう
gulp.watch
はgulp
外のシステムと組み合わせようとするとかなり辛い