Align with Prettier

[jhnns]

Prettier is awesome 🏆 and we're using it in a lot of projects anyway. Prettier's formatting is compatible with a lot of Peerigon rules, but not all of them.

We should try to align with Prettier as close as possible to make it easy to use both our ESLint rules and Prettier. This issue is dedicated to collect all the instances where our rules deviate from Prettier:

• Align ternary format (Prettier puts the ? and : on the next line)
• Remove braces where the operator precedence is clear (Prettier avoids putting braces)

[hpohlmeyer]

The CLI helper of eslint-config-prettier can be used to determine problematic rules. I’ve set up a small demo repo with prettier and some peerigon rules. Here is the output of the CLI helper:

CLI helper output

The following rules are unnecessary or might conflict with Prettier:

- @typescript-eslint/member-delimiter-style
- @typescript-eslint/type-annotation-spacing
- array-bracket-newline
- array-bracket-spacing
- arrow-spacing
- babel/object-curly-spacing
- babel/semi
- block-spacing
- brace-style
- comma-dangle
- comma-spacing
- comma-style
- computed-property-spacing
- dot-location
- eol-last
- func-call-spacing
- generator-star-spacing
- indent
- jsx-quotes
- key-spacing
- keyword-spacing
- multiline-ternary
- new-parens
- newline-per-chained-call
- no-extra-semi
- no-floating-decimal
- no-mixed-spaces-and-tabs
- no-multi-spaces
- no-multiple-empty-lines
- no-trailing-spaces
- no-whitespace-before-property
- object-curly-newline
- object-property-newline
- operator-linebreak
- padded-blocks
- quote-props
- react/jsx-child-element-spacing
- react/jsx-closing-bracket-location
- react/jsx-closing-tag-location
- react/jsx-curly-spacing
- react/jsx-equals-spacing
- react/jsx-first-prop-new-line
- react/jsx-indent
- react/jsx-indent-props
- react/jsx-max-props-per-line
- react/jsx-tag-spacing
- rest-spread-spacing
- semi-spacing
- semi-style
- space-before-blocks
- space-before-function-paren
- space-in-parens
- space-infix-ops
- space-unary-ops
- switch-colon-spacing
- template-curly-spacing
- template-tag-spacing
- unicode-bom
- yield-star-spacing

The following rules are enabled but cannot be automatically checked. See:
https://github.com/prettier/eslint-config-prettier#special-rules

- babel/quotes
- max-len
- no-mixed-operators
- no-tabs
- no-unexpected-multiline
- prefer-arrow-callback

the following rules have been used:

// .eslintrc.json

{
  "extends": [
      "peerigon",
      "peerigon/typescript",
      "peerigon/styles/prefer-arrow",
      "peerigon/react",
      "peerigon/styles/react-jsx-no-literals",
      "peerigon/styles/react-jsx-allow-bind"
  ],
  "env": {
      "node": true
  },
  "root": true
}

I think we should check these rules and keep the ones that are "unnecessary", since you likely want to have linting for these rules if you don’t use prettier.

If you do use prettier though, I think reporting eslint errors that will be automatically fixed by prettier might not be the best idea, since you might feel, that you need to fix those errors manually.

What do you think of having a subset of rules that are obsolete if you use prettier, but can help if you don’t use it?

[jhnns]

I've removed all format related rules from base.js because ESLint deprecated their formatting rules. Since we're using Prettier everywhere now it doesn't make sense to maintain these rules.

Unfortunately we still need to use eslint-config-prettier because there are still some redundant rules left that haven't been deprecated (e.g. for React). I've created another issue for that #107