proposal: standard versus prettier (code style)

[jokeyrhyme]

standard:

• automated code style compliance (via ESLint plugins and --fix)

• no semi-colons, or add SemiStandard to get them back

• prefers spacey braces / brackets / parens in a few places

• doesn't have any preference or automated fixes for line-breaks, etc

• requires 4 extra devDependencies in package.json at a minimum (and all the greenkeeper.io noise that entails)

• auto-style when saving files, by virtue of IDE/editor plugins for ESLint

prettier:

• automated code style compliance

• semi-colons

• prefers compact braces / brackets / parens (not spacey)

• only starts .then() on a new line if not enough room in promise's line

• special focus on realistic and legible line-breaks

• just 1 devDependencies entry

• to achieve auto-style when saving files, need to wire up npm run prettier somehow /shrug

• endorsed / used by Facebook on their own code

In both cases, we'd keep ESLint and the "eslint:recommended" set of rules, but we drop a few standard-specific ESLint devDependencies if we go with prettier for code style
We'd also continue to keep the additional non-style ESLint plugins that we use

It may also be wise to wait for prettier to stabilise, although it doesn't break anything within this project here

Please vote with reaction / emoji things on subsequent comments

See also:

• https://twitter.com/geteslint/status/773965444629667840

• https://twitter.com/geteslint/status/839929305211609089

[jokeyrhyme]

OPTION: Standard (or SemiStandard) with ESLint (status quo)

package.json:

{
  "devDependencies": {
    "eslint": "...",
    "(eslint-config-semistandard)": "...",
    "eslint-config-standard": "...",
    "eslint-plugin-promise": "...",
    "eslint-plugin-standard": "...",
  },
  "scripts": {
    "eslint": "eslint --fix --cache .",
    "posttest": "npm run eslint"
  }
}

.eslintrc.json

{
  "extends": [ "eslint:recommended", "(semi)standard" ]
}

[jokeyrhyme]

OPTION: prettier

package.json:

{
  "devDependencies": {
    "eslint": "...",
    "prettier": "...",
  },
  "scripts": {
    "eslint": "eslint --fix --cache .",
    "posttest": "npm run eslint",
    "pretest": "npm run prettier",
    "prettier": "prettier --single-quote --write \"{app,__{tests,mocks}__}/**/*.js\""
  }
}

.eslintrc.json

{
  "extends": [ "eslint:recommended" ]
}

When running this on this project itself, the majority of changes are semi-colons, some alternative line-breaks, and removal of spaces here and there, so it's already very similar to JavaScript Standard style

[jokeyrhyme]

We can also keep eslint-plugin-promise if we feel that set of (non-style) rules is important...

[jokeyrhyme]

A reasonably comprehensive glob for "write-in-place" mode can be specified as follows:

$(npm bin)/prettier --single-quote --write "{{app,bin,lib,src,test,tests,__{tests,mocks}__}/**/,}*.{js,jsx,mjs}"

[jokeyrhyme]

Probably should wait to see what advise / fixes are given RE:

• Flow comments will be turned into flow annotations prettier/prettier#204

• Flow Typecast Comments prettier/prettier#719

[jokeyrhyme]

https://hackernoon.com/what-javascript-code-style-is-the-most-popular-5a3f5bec1f6f