2017年に登場したPrettierというコードフォーマッタがあります。自分はPrettierをmottoさんから教えていただいただきました。使ってみた感想ですが、デフォルト設定があるため非常に簡単に利用することができ、馴染みやすく大変重宝しています。今回はデフォルト設定に何が設定されているかを確認してみたいと思います。また、そのデフォルト設定をコマンドライン上ではどうやって変更するのかを記述しておきます。
Print Width
デフォルトは80文字に設定されています。
1行が80文字を超えると、自動的に折り返してくれるようです。
prettier --print-width 60 index.jsとすることでindex.jsの中身を60文字に変更することができます。
一般的には100文字か120文字がいいようで、デフォルトで用意されている数は若干少ないようです。
Tab Width
デフォルトは2文字分のスペースを確保するように設定されています。
prettier --tab-width 4 index.jsとすることで4文字分のスペースを確保するように設定できます。
Tabs
スペースの部分をタブに置き換えます。デフォルトでは機能しません。
prettier --use-tabs index.jsで実行できます。半角スペース2文字分空いている部分に実行したら8文字分空きました。半角スペース4文字あけている部分に対して実行しても8文字分となりました。
Semicolons
行の最後にセミコロンを配置します。デフォルトで機能します。
prettier --no-semi index.jsでセミコロンをすべて排除します。
Quotes
すべてのクォートをダブルクォートに設定します。デフォルトで機能します。
prettier --single-quote index.jsですべてをシングルクォートに変更することができます。
Trailing Commas
末尾にカンマを設定するかどうかの機能です。デフォルトではカンマを設定しないようになっています。
prettier --trailing-comma es5 index.jsでes5に準拠した設定になります。具体的にはオブジェクトの末尾にカンマが設定されるようになります。
Bracket Spacing
キー・バリューペアの前後にスペースを挿入します。デフォルトは機能し、スペースが挿入されます。
prettier --no-bracket-spacing index.jsでスペースを排除します。
{ foo: bar }となります。
参考
