✔️
（今更）prettier のデフォルト設定を出力して掃除する

2025/05/07に公開
 tl;drprettier をなんとなくで使っていたので学び直し
設定ファイルにデフォルト値と同じ値を入れないようにデフォルト値を取り出してみた
なんでドキュメントにそういうのがないの？

 経緯GWだし超久しぶりにフロントエンドまわりに再入門しようかな
TypeScript をごりごりするワークスペース新しく用意しよ
ツールチェインまわりはちゃっぴーに聞くか
パッケージマネージャー: pnpm
フォーマッター: Prettier
Linter: ESLint
テストランナー: Vitest
ビルドツール / バンドラー: Vite
型チェック: TypeScript（必要に応じて tsc or vue-tsc）
そういえば Prettier は VS Code にエクステンションで入れてあってなんにも設定してない
普段 Terraform ばっかりやってるから Prettier の恩恵とか気にしてない
というわけでざっとドキュメントを読んで勉強した
to stop all the on-going debates over styles
なら設定ファイルに書くことは、デフォルトの設定とは違うことに注意しろ、と判断すべき
どっかからコピペしてきて用意した .prettierrc.json に "tabWidth": 2 が入ってて、こりゃ掃除しないとダメだなって思った

 こだわりコードは短ければ短いほどよい。設定は少なければ少ないほどよい。ただし、中身について理解していることを前提とする
昔先輩に教わった教えのひとつで、最近ならリーダブルコードや脳に収まる～とかでも書かれているように、読んで理解してもらいやすい状態が正、ということだと理解している
コードフォーマッターやリンターはゼロコンフィグであって欲しい
デフォルトとは違う値にするなら、相応の理由があるということ
ということで Prettier の設定のデフォルト値が必要
Options · Prettier
ドキュメントがあるから要らないんじゃん？って考える人はたぶんプログラマに向いてない（小声
プログラムや設定が変更されるのは自明なので、プログラムからデフォルトの設定値を取り出せるようにするのは継続的・自動的に処理できるようにするために必要なのである（プログラマの三大美徳、怠惰）
そもそもコマンドラインオプションに設定ファイルを出力するオプションでもあればいいのに（ないのが悪い）（同、傲慢）
というわけでちょっと書いた（同、短気）

 ちょっと探してみたもの
simulacrumparty/prettier-default-config 更新されてないみたい？

Default prettier config with comments and links to prettier rules プログラムから引っ張ってこない
前述の本家ドキュメント Options · Prettier ソートすらされてないってゆうか、せめて設定のキーを見出しにしたほうがわかりやすくない？
CLI のオプションに --list-config とか --init-config があればいいのに

 書いたもの正確には ChatGPT に何度も騙されながら推敲したもの
とりあえず今のとこちゃんと動いてる
オプションをソートして出力しているので、既存のファイルと diff とって処理しやすいはず

node prettier-default.js でいけると思う
prettier-default.js
// Prettier のデフォルト設定を出力するスクリプト
// 参考: https://prettier.io/docs/en/api.html#get-support-info
const prettier = require("prettier");

(async () => {
  const supportInfo = await prettier.getSupportInfo();
  const defaults = Object.fromEntries(
    supportInfo.options
      .map((opt) => [opt.name, opt.default])
      .sort(([keyA], [keyB]) => keyA.localeCompare(keyB))
  );
  console.log(JSON.stringify(defaults, null, 2));
})();
でてきたのがこちら
{
  "arrowParens": "always",
  "bracketSameLine": false,
  "bracketSpacing": true,
  "cursorOffset": -1,
  "embeddedLanguageFormatting": "auto",
  "endOfLine": "lf",
  "experimentalOperatorPosition": "end",
  "experimentalTernaries": false,
  "htmlWhitespaceSensitivity": "css",
  "insertPragma": false,
  "jsxSingleQuote": false,
  "objectWrap": "preserve",
  "plugins": [],
  "printWidth": 80,
  "proseWrap": "preserve",
  "quoteProps": "as-needed",
  "rangeEnd": null,
  "rangeStart": 0,
  "requirePragma": false,
  "semi": true,
  "singleAttributePerLine": false,
  "singleQuote": false,
  "tabWidth": 2,
  "trailingComma": "all",
  "useTabs": false,
  "vueIndentScriptAndStyle": false
}

cursorOffset ってなんじゃらほい（未確認）

rangeEnd のデフォルトは infinity ってことになってるけど null 表現なの？

 まとめてないけどまとめデフォルト設定と同じ設定を書かないこと
設定値を変更するなら明確な理由と具体的な課題をつけてドキュメントにしておいて欲しい（ADRが望ましい。そして本家に issue を送るんだ）
ESLint や editorconfig との重複や競合などはドキュメントにしておいて欲しい
強いこだわりがなければ json もキーでソートして出力しておけ（VS Code なら JSON:Sort Document）

 お願いツールチェインの取捨選択で Biome が漏れたんだけど、実際のところ最近のフロント界隈では流行ってる？（かどうかをコメントで教えて欲しい）
AI無課金勢なので、生成系はほとんど使ってないんだけど、課金したら一発で同じことができるコードを出力してくれるのか気になる。のでAI課金勢の諸兄にちょっと試してもらいたい
もしデフォルトの設定値を出力する公式の方法がどこかにあったら教えてほしい

 追記コードに後付でコメント書いたら API の URL が参考としてサジェストされた
見てみたら getSupportInfo() が出てるんだけど、default については記載がない
戻り値を作る前に default を埋めてるっぽい。ドキュメントもうちょいどうにか。。。

 追記2X で Gemini 2.5 Pro の話題が流れてたのでちょっと試してみたんだけどダメだった

getSupportInfo() のドキュメントが不備なせいか、そもそも使おうとしない
結局 ChatGPT に指示しながらやったのとほぼ同じ感じの流れになってしまった
プロンプトの渡し方が悪いんか。。。？
tl;dr

経緯

こだわり

ちょっと探してみたもの

書いたもの

まとめてないけどまとめ

お願い

追記

追記2

Discussion
