zenn-cli + reviewdog + textlint + GitHub Actions で執筆体験を最高にする

公開:2020/09/28
更新:2020/09/30
4 min読了の目安(約4200字TECH技術記事
Likes51

はじめに

前回の記事を書く際に textlint + reviewdog + GitHub Actions を導入してみたところ、Zenn での執筆体験がさらに上がったので紹介します。

具体的には、このようにプルリクエストのレビューコメントが自動でつくようになります。

手順通りに行えば、おそらく 10 分程度で設定ができるはずです。Zenn でより質の高い記事を投稿したいと考えている方はぜひトライしてみてください。

導入手順

自分にあった lint ルールがあるはずなので、適宜読み替えてください。
まずは運用してみてからカスタマイズしたいという方は、この手順通りに進めてみてください。

  1. textlint と textlint のプリセットルールをインストール
    $ npm install --save-dev textlint textlint-rule-preset-ja-technical-writing textlint-rule-preset-ja-spacing
    
  2. .textlintrc を作成し、以下の内容をペースト
    {
      "plugins": {
        "@textlint/markdown": {
          "extensions": [".md"]
        }
      },
      "rules": {
        "preset-ja-technical-writing": {
            "no-exclamation-question-mark": {
            "allowFullWidthExclamation": true,
            "allowFullWidthQuestion": true,
          },
          "no-doubled-joshi": {
             "strict": false,
             "allow": ["か"], // 助詞のうち「か」は複数回の出現を許す(e.g.: するかどうか)
          }
        },
        "preset-ja-spacing": {
          "ja-space-between-half-and-full-width": {
            space: "always",
            exceptPunctuation: true,
          },
          "ja-space-around-code": {
            "before": true,
            "after": true
          }
        },
        "ja-technical-writing/ja-no-mixed-period": {
          "allowPeriodMarks": [":"],
        },
        "ja-technical-writing/sentence-length": false //100文字数制限の無効化
      }
    }
    
  3. .github/workflows/reviewdog.yml を作成し以下の内容をペースト
    name: reviewdog
    on: [pull_request]
    jobs:
      textlint:
        name: runner / textlint
        runs-on: ubuntu-latest
        steps:
          - uses: actions/checkout@v2
            with:
              submodules: true
          - name: textlint-github-pr-review
            uses: tsuyoshicho/action-textlint@v1
            with:
              github_token: ${{ secrets.github_token }}
              reporter: github-pr-review
              level: warning
              textlint_flags: "articles/**"
    
  4. master ブランチに commit & push

これで導入は完了です。

master から新たにブランチを切り、記事を commit & push & プルリクエストを作成してみてください。GitHub Actions が起動し、reviewdog が textlint のルールに従ってレビューコメントが投稿されるはずです。

まさにこの記事に対してレビューコメントが投稿されました。ここでは「思います」という表現に対して指摘が入りました。実際の Pull Request はこちらで見れるようになっています。

さらにカスタマイズしたい方向けの参考資料

今回導入したライブラリやルールプリセット、また僕が設定する際に参考させて頂いた資料を記載しておきます。

番外編: vscode-textlint

執筆環境として VS Code を利用している場合は vscode-textlint というプラグインを導入するとさらに良いでしょう。
インストール後 VS Code を再起動すると textlint が有効なプロジェクトの場合は自動的に適用され、以下のように指摘をしてくれるようになります。

さらに詳細を知りたい場合はこちらの textlint と VS Code で始める文章校正 という記事が抜群に分かりやすいのでぜひご覧ください。

終わりに

僕は一文が長い文章を書いてしまいがちなので、linter に読点を使いすぎないよう強制させられることで良い訓練になっていると感じています。
また、textlint のルールは奥が深そうなので、しばらく記事を書きながら調整していきたいと思います。


この記事は GitHub 連携で書いています。加筆修正など修正 PR を受け付けています!
https://github.com/serima/zenn-content