Prettier - izudon/izudon.github.io GitHub Wiki
- See also ESLint
10.2 節に詳しい。
インストール
$ npm install --save-dev prettier
$ yarn add --dev prettier
設定
.prettierrc
{
"semi": true,
"trailingComma": "es5",
"singleQuote": false,
"printWidth": 80
}
semi: 行末(文の終わり)にセミコロンをつけるか。trailingComma: 配列等の最終要素の末にコンマを付けるか。singleQuote: 引用符を'にするか(falseにすると"になる)。printWidth: 1行の文字数。
利用
- チェックのみ
$ npx prettier --check 〈ファイルまたはフォルダ〉$ yarn run -s prettier --check 〈ファイルまたはフォルダ〉 - 書き換える
$ npx prettier --write 〈ファイルまたはフォルダ〉$ yarn run -s prettier --write 〈ファイルまたはフォルダ〉
スクリプトに登録
package.json"scripts": { "eslint": "prettier --write 'src/**/*.js'" },
$ npm run prettier
$ yarn run prettier
資料
2022.10.12ESLint、Prettierによりソースコードを自動整形してみた2022.09.08Prettierの導入方法 - フロントエンド開発で必須のコード整形ツール - ICS MEDIA2022.05.31ESLint・Prettierを併用してコードスタイルのチェックはPrettierにまかせてみた|SHIFT2019.12.07ESLint / Prettier について学んだことまとめ - Qiita2018.02.22Prettier 入門 ~ESLintとの違いを理解して併用する~ - Qiita- npmとyarnのコマンド早見表 - Qiita

