久しぶりにguard-livereload設定したら分からなかったので作業メモ

guard-livereload.md

gemfileを変更

group :development, :test do
  gem 'guard'
  gem 'guard-livereload', '~> 2.5', require: false
  gem 'rack-livereload'
end

Guardfileを初期化、実行テスト

$ bundle install
$ guard init
$ guard init livereload
$ guard

rack-livereloadを有効化(Rackのミドルウェアでスクリプトタグを本文に挿入して貰う）

Rails.application.configure do
  ～
  # Add Rack::LiveReload to the bottom of the middleware stack with the default options:
  config.middleware.insert_after ActionDispatch::Static, Rack::LiveReload
  # config.middleware.insert_before Rack::Lock, Rack::LiveReload # or, if you're using better_errors:
  # config.middleware.use(Rack::LiveReload,
  #   min_delay        : 500,    # default 1000
  #   max_delay        : 10_000, # default 60_000
  #   live_reload_port : 56789,  # default 35729
  #   host             : 'myhost.cool.wow',
  #   ignore           : [ %r{dont/modify\.html$} ]
  # )
  ～
end

手動でスクリプト挿入でも良い

<script src="http://hostname:35729/livereload.js?snipver=1"></script>

guard 起動

$ bin/rails s
$ gaurd

• ブラウザで接続する
  • 拡張機能のアイコンをクリックして真ん中が引かれば接続成功 ※ポインタを合わせてしばらく待って[livereload connect]表示の確認でもよい  - guard consoleにconnectedと表示されればok

参考

• guard/guard-livereload: Guard::LiveReload automatically reload your browser when 'view' files are modified.
• johnbintz/rack-livereload: Bring in livereload.js into handy Rack middleware