Prettier - izudon/izudon.github.io GitHub Wiki

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

資料

Code Formatting with Prettier in Visual Studio Code