# Github Actionでprettierを実行したい

5 min read

フォーマットを書けるのが面倒くさい。

このブログはマークダウンで書かれていて、コミットする前に必ずprettier --writeを実行しようと心に誓ったけど、まったくというほど実行されずにきた。そしてたまに思いだしたように実行し、毎回あげだされる差分に驚いてきた。

エンジニアとして対策しないのかという話だけれど、以前対策を試みGithub Actionを登録したけれどうまく動かず、そもそも最悪フォーマットしなくても問題ないので時間かけるのもどうだろうかとissueに登録して寝かせていた。

Closeされずにずっと残り続けるissueは心を蝕む…、なんてことはないけれど少し気持ち悪い。

そこで時間をかけてもいいので、解決することを最優先課題にしてみた。

そういうわけで色々なサイトを巡回し調べた結果、

name: Format Markdown
on:
push:
branches:
- main
permissions:
contents: write
jobs:
format:
runs-on: ubuntu-latest
steps:
- name: Check out the repository
uses: actions/checkout@v3
with:
fetch-depth: 0
- name: Set up Node.js
uses: actions/setup-node@v3
with:
node-version: "18"
- name: Install Prettier
run: npm install -g prettier
- name: Format Markdown files
run: prettier --write "**/*.md"
- name: Push changes
run: |
git config --global user.name "github-actions[bot]"
git config --global user.email "github-actions[bot]@users.noreply.github.com"
git stash # 現在の変更を一時保存
git pull origin main # リモートの変更を取得
git stash pop # 保存した変更を復元
git add . # 変更をステージング
git commit -m "Format markdown files" || echo "No changes to commit"
git push origin main

で実現できた。

やっていることは以下の通りで、シンプル。


  1. ワークフローのトリガー設定:

    • mainブランチにプッシュされたときにこのワークフローが実行されます。
  2. リポジトリのチェックアウト:

    • actions/checkout@v3アクションを使ってリポジトリの全体(過去の履歴も含む)を取得します。
  3. Node.jsのセットアップ:

    • actions/setup-node@v3アクションを使い、Node.jsのバージョン18をインストールします。
  4. Prettierのインストール:

    • npm install -g prettierを使って、Markdownフォーマット用のツールであるPrettierをグローバルにインストールします。
  5. Markdownファイルのフォーマット:

    • prettier --write "**/*.md"コマンドで、リポジトリ内のすべてのMarkdownファイル(*.md)をフォーマットします。
  6. 変更のプッシュ:

    • 以下の手順でフォーマットした変更をリモートのmainブランチにプッシュします:
      • git stashで現在の変更を一時的に保存。
      • git pull origin mainでリモートの最新変更を取得。
      • git stash popで保存した変更を再適用。
      • git add .で変更をステージング。
      • git commitで変更をコミット(変更がない場合はスキップ)。
      • git push origin mainで変更をリモートにプッシュ。

過去の試行錯誤を見るに、Tokenとかを生成したりしているし、参考サイトにはTokenを生成している記事も多かった。

ただ、

GitHub Actionsでは、GITHUB_TOKENがデフォルトで自動的に適用される。このトークンはGitHubによって自動的に生成され、ワークフローのすべてのジョブで利用可能になっている。

とのこと。

Githubの方でアップデートがされたのか、そのおかげかしら?

過去の自分が何に躓いていたのかはわからないけれど、うまくいってよかった。


[!NOTE] > Hugoブログで最終更新日がすべて同じになっていたのを修正したで更新した。

My avatar

Thanks for reading my blog post! Feel free to check out my other posts or contact me via the social links in the footer.


More Posts

Comments