こんにちは、だいちゃんです。

Nuxt.js（Vue）で作っていて、エディターとターミナルでほとんどの作業が完結するこのブログですが、より簡単に、手数を減らせるようにアップデートをしました！

npm-husky で git push をhookにレンサバへアップロード

husky というnpmパッケージを利用すると、git commitやgit pushをhookにしてnpm scriptなどを走らせることができるようになります。

今回はこれを活用して、git push するだけで自動でアップロードまで実行出来るように調整してみます。

すでに blog という名前のnpm scriptを作成していて、 npm run blog と叩くだけでマークダウンからjsonへの変換・Nuxtの書き出し（generate）・公開用レンタルサーバーへのアップロードを一括して実行できるようにしています。

＞ npm-run-allの導入とページネーションの修正をしました

ということで、あとはgit pushを実行したときにこのnpm scriptも一緒に実行させれば目的を達成できそうです。

npm husky のインストールと設定

早速インストールします。

$ npm istall husky --save-dev

無事インストールが完了したら、package.jsonに下記を書くだけ！

{
  "husky": {
    "hooks": {
      "pre-push": "npm run blog"
    }
  },
}

これで、いつものようにブログを書いて add・commit・push するだけで、あとはよしなに コンパイルとかアップロードとかをこなしてくれます！ 便利！

dist ディレクトリを gitignore に

今回の変更の小さな問題点は、 コミットの後にしかgenerate（nuxtjsの書き出し）がされない という点です。

いままでなら json変換・generate・アップロード の後に add・commit・push を行っていたので、distディレクトリ配下もコミットに含めてましたが、今回の変更はpushをhookにしているので、いままでとは手順が逆になりました。

でも、そもそも src 配下のソースファイルが保持出来ていればgenerate後のファイルは無くても困らない（必要な時に generate すれば同じものが手に入る）ので、これを期に generate 後に生成される下記のファイル＆フォルダは.gitignoreに設定することにしました。

• /dist/ ・・・ディレクトリ配下全て。generate時に全て生成されるのでgit管理不要
• src/_BLOG/json/ ・・・マークダウンから変換することでjsonを生成させてるのでgit管理不要

/dist/ という指定方法にした理由は、最初のスラッシュ / がないとどこか深い階層に dist というディレクトリを作った時、そいつが認識されない事態を回避するためです（最初のスラッシュがあればルート直下の dist にしか効かない）。まぁそんな状況無いと思うし、やっちゃダメな気がしますが（汗）

また、いままでgit管理してたものは .gitignoreに追記するだけではgitが追跡し続けてしまう ので、一度下記を実行してキャッシュを削除必要があります。

$ git rm -r --cached dist/.
$ git rm -r --cached src/_BLOG/json/

rmコマンドなので少々抵抗がありますが、あくまでキャッシュの削除なので、ファイル実態が削除されることはありません（ コマンドを間違えない限り ）

これで、毎回のgenerate作業が無くなりました。

pushのたびに走るので、例えばブログ本体には影響しない README ファイルの書き換えや、下書きを追加した時などもスクリプトが走ってしまい、少しウザく感じることもあると思いますが、多くの場合はpush ＝ 公開だと思うので気にする必要はないと思っています。