Jump to the content

Jekyllにライブリロード機能を追加する「Hawkins」

Jekyll

    Jekyllにライブリロード機能を追加する「Hawkins」

    どうも、イソップです。

    Jekyllでは serve コマンドを使用することで、ファイル編集の度にサイトデータを構築しなおす監視機能がありますが、 できればブラウザの更新もしたいのです。

    ファイルが生成される度に手動でリロードしているようでは、すぐに日が暮れてしまいます。

    そこで、ブラウザの自動リロード(ライブリロード)機能のJekyllプラグインはいくつかありますが、 実際に試してよかった「Hawkins」を紹介します。

    Hawkinsをインストールする

    Hawkinsは、Jekyllにブラウザのライブリロード機能を追加するプラグインです。

    Jekyllのバージョン 3.1 以上で利用可能です。
    今回はbundlerでのインストール方法を紹介します。

    Gemfileには次のコードを追記します。

    group :jekyll_plugins do
      gem 'hawkins'
    end
    

    ターミナルで、 bundle install コマンドを入力します。

    $ bundle install
    

    ライブリロード機能の使用方法

    ライブリロードの使用は非常にカンタンです。

    インストールが完了すると、jekyll liveserve コマンドが追加されます。 jekyll serve コマンドにライブリロード機能が追加されたものになります。

    さっそくターミナルで次のコマンドを入力すると、ローカルサーバーが立ち上がります。

    $ jekyll liveserve
    

    その他のオプションについては、ヘルプオプションを付けてコマンドを実行してみてください。

    $ jekyll liveserve --help
    

    liveserveオプション一覧

    ぼくのオススメは、limit_posts オプションを 2 など小さい数字にすると、生成されるページが少なくなって、 ビルド時間を短縮できるので、サクサクページが作れてストレスフリーです。

    ぜひ試してみてください。

    注目記事

    最近の記事

    ぼくが書いてます

    フロントエンドエンジニア

    イソップ

    ページの先頭に戻る

    Search results

    ×