JSのコードの自動整形に Prettier が便利だったので、eslint とAtomから使えるように設定した

vjeux先生謹製のコード整形ツール。Reactでも使われてる。
gofmt やあのへんを目指してるっぽい。

eslint で使う

この辺

yarn add eslint babel-eslint prettier eslint-plugin-prettier eslint-config-prettier -D

自分はStandard派だったので、シングルクオート、ノーセミコロンにした。opinionated なフォーマッタにオプション付けるのはどうなの？という気持ちはありつつ、セミコロンを見たくないという気持ちが勝った。

.eslintrc.yml

parser: babel-eslint
plugins:
  - prettier
extends:
  - prettier
  - prettier/flowtype
  - prettier/react
rules:
  prettier/prettier:
    - 2
    -
      trailingComma: none
      singleQuote: true
      semi: false

yarn eslint -- src --fix などして既存のコードに適用した。

atom

apm install atom-prettier

ここでもシングルクオート、セミコロンを消す設定をしつつ、プラグインの設定画面からローカルのeslintを見るようにした。ファイル保存時に自動で走るようにした。

自分の設定全体はこちら