prettier を導入してみた

• 概要
• 環境
• インストール
• .prettierignore
• 試す
• オプション
• 最後に
• 参考サイト

概要

prettier は JavaScript 用のコードフォーマッターです
今回は CLI で使う方法を紹介します

環境

• macOS 15.0
• nodejs 20.17
• prettier 3.3.3

インストール

• npm i prettier

.prettierignore

• vim .prettierignore

*.md
Dockerfile
*.json

試す

• npx prettier --check .

Checking formatting...
[warn] index.js
[warn] Code style issues found in the above file. Run Prettier with --write to fix.

で実際に修正してもらう場合は

• npx prettier --write .

特定のファイルに対して実行する場合は

• npx prettier --write index.js

オプション

いろんなファイルの方式があります (参考)

• vim .prettierrc.json

{
  "printWidth": 20
}

これで再度 npx prettier を実行すると20文字以上の部分が改行されるようになります
オプションは引数でも指定できますがファイルに記載することもできます

最後に

vue などのフロントサイドのコードもフォーマットしてくれるので便利です

参考サイト

• https://prettier.io/docs/en/
• https://prettier.io/docs/en/options