3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Gitbookのライブリロードが失敗するのをどうにかする

Last updated at Posted at 2017-04-15

はじめに

モチベーション

Markdownで電子書籍を出力するアプリケーションであるGitBookをちょっと触ったらサーバーのリロードで立ち往生したので、記録を残しておきます。
ちなみに、GitBookのwebサービスを使っていれば、このような問題は起こりませんので、直接利用できる方はそちらをお薦めします。

障害の条件

Windows10で作業していました。コミュニティをみたら、今回取り上げる問題はWindows環境特有の問題らしいので、MacやLinuxの方々には全くもって価値のない情報です。

作業環境

今回は以下の環境で実行を行いました。

  • windows10 Creators update
  • Node.js 5.6.0
  • npm 3.6.0
  • CLI 2.3.0
  • GitBook 3.2.2

読み進める前に

今回の記事は、以下の技術評論社の記事の2ページ目を実行した続きからとなっています。導入方法などはこちらを参照ください。
第406回 Node.js製のGitBookでお手軽に電子書籍作成

本題

どんな問題が起こったのか?

はじめにでも書きましたが、詳細に問題を定義しようと思います。問題は、gitbook serveを実行した後に、電子書籍にの本文である*.mdを編集・保存すると、ライブリロードがかかるのですが、エラーでサーバーが終了してしまうという問題です。
WS000003.JPG
画像がみずらいですが、どうやら操作権限が問題で止めたサーバを再起動する前に処理が終了しているようです。

解決法

gulpで操作を監視して、サーバーを自分で操作しようと思ったら、すでに作っている方がおられたので、それをそのままこちらで紹介します。

Gitbook serve with gulpjs

導入法

ここからは完全に他人のふんどしの使い方をステップバイステップで説明してゆきます。

用意するもの

gulpfile.js ( Gitbook serve with gulpjs )
をあらかじめダウンロードして用意しておいてください。

階層構造の作成

作業フォルダを作成してください。今回は便宜上myBookとしておきます。作業フォルダのパスは任意の場所で良いので、今回は%BOOKPATH%と仮に表記します。なので、作業フォルダまでのフルパスは%BOOKPATH%\myBookということになります。

myBookの中にdocsフォルダを作成してください。

この段階で、以下のような階層構造になるようにファイルなどを移動させてください。

%BOOKPATH%\myBook
              |----\docs
                      |---- (ここに電子書籍本文が入る)
              |
              |----gulpfile.js

gitbookを初期化

docsフォルダがgitbookのデータを収めるフォルダになります。初期化のためにコマンドプロンプトでdocsフォルダをカレントフォルダに変更し、gitbook initしてください。初期化の詳しいやり方は、前章の読み進める前にを参照してください。
初期化するとdocsフォルダに新しいファイル二つが生成されますので、以下のようになります。

%BOOKPATH%\myBook
              |----\docs
            |---- README.md
                      |---- SUMMARY.md
                      |---- (ここに電子書籍本文が入る)
              |
              |----gulpfile.js

gulpを利用するためのモジュールをインストールする

ダウンロードしたgulpfile.jsを利用するために、gulpを含む以下のモジュールをインストールしてください。
コマンドプロンプトを開き、%BOOKPATH%\myBookをカレントフォルダに変更します。それから以下のようにモジュールをインストールしてください。

%BOOPATH%\myBook>npm install gulp

%BOOPATH%\myBook>npm install browser-sync

%BOOPATH%\myBook>npm install gitbook

%BOOPATH%\myBook>npm install del

インストール作業することで、myBookフォルダにnode_modulesが作成されます。

gulpを利用してサーバーを起動する

コマンドプロンプトを開き、%BOOKPATH%\myBookをカレントフォルダに変更します。それから以下のようにコマンドを打ち込むとサーバーが起動し、ブラウザに表示されます。

 %BOOPATH%\myBook>gulp

書籍を編集する

docs以下のフォルダの.mdファイルは常に監視されていて、追加や変更された場合、gulpがサーバーを再起動します。試しにREADME.mdを編集したり、新しいファイルを作成したり確認してみてください。

サーバを終了する

サーバー起動中のコマンドプロンプトでCtrl + Cを押すと停止します。

おわりに

駆け足で使い方を説明しました。gitbookの記事は最近少ないですね。あんまり需要ないのかな。

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?