zenn-cli から記事を書く際に textlint で文章をチェックする

2020/09/22に公開

zenn-cli の準備

新しいプロジェクトを yarn で作成します。

yarn init
yarn add zenn-cli

このとき package.json の npm script にプレビューや新規記事の作成のためのスクリプトを追加しておくと便利です。

scripts: {
  "preview": "npx zenn preview",
  "new:article": "npx zenn new:article"
}

./articles/ 以下に新規 Markdown ファイルが作成されます。

yarn new:article

localhost:8000 でプレビュー環境が立ち上がります。

yarn preview

textlint の導入

パッケージ追加

yarn add textlint textlint-filter-rule-comments textlint-rule-preset-ja-spacing textlint-rule-preset-ja-technical-writing textlint-rule-prh

textlint の設定

textlint の設定は下記の内容で .textlintrc を作成します。

{
  "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文字数制限の無効化
    "prh": {
      "rulePaths": ["rules.yml"]
    }
  },
  "filters": {
    "comments": true
  }
}

表記ゆれ検出の設定

表記ゆれの検出のため rules.yml を作成します。
下記の内容は nextjs, next.js, NextjsNext.js の表記ゆれとして検出します。

version: 1

rules:
  - expected: Next.js
    pattern:
      - nextjs
      - next.js
      - Nextjs

npm script を追加

package.json に textlint, textlint:fix を追加します。

scripts: {
  "preview": "npx zenn preview",
  "new:article": "npx zenn new:article",
  "textlint": "textlint",
  "textlint:fix": "textlint --fix"
}

指定したファイルの文章をチェックします。

yarn textlint ./articles/xxxxx.md

指定したファイルの文章で機械的に修正可能な項目を修正します。

yarn textlint:fix ./articles/xxxxx.md

まとめ

textlint を導入することで文章のフォーマットが統一されるため読みやすい文章になるのでお勧めです。

Discussion