Issue Overview

The prettier javascript auto-formatter has already come up in the WordPress/packages PR and #core-js discussion a few weeks back. For anyone who wants a fun introduction to what prettier is, feel free to watch the creators lightning talk at ReactConf: https://www.youtube.com/watch?v=hkfBvpEfWdA
or listen to one of the episodes of 5 minutes of React podcast about Prettier:
https://m.soundcloud.com/5minreact_audio/018-prettier

tldw:

• Prettier auto-formats your code so you don't need to (DevEx++). A linter like eslint cannot reliably fix style issues (and also doesn't ensure standard formatting around things like linebreaks).
• It reduces the learning curve for new OSS contributors.
• It acts as a teaching tool by wrapping expressions according to javascript's order of operations
• Webpack, Babel, React, Jest, Zeit, Calypso and more are all using it (prettier is well tested).
• It is not very configurable. At the moment it doesn't support spacing conventions WordPress core's JS Coding Standards enforeces.
• The initial "npm run prettier" commit would mess with our git blame.

Props to @samouri for preparing a ver similar list here in the context of Calypso.

Current Behavior

In my opinion, there is one blocker that needs to be resolved, which @aduth mentioned in this post Proposal for JS Standards Revision: Removing Array/Function Whitespace Exceptions:

Coding standards have been a recurring topic in the JavaScript Weekly Chat over the past few months. One rule in particular which has been the focus of much discussion are the exceptions for whitespace in arrays and function calls ...

There seems to be general agreement that we should remove all exceptions, which would make usage of Prettier completely valid. There is still one issue that would have to be tackled - WordPress spacing conventions - which aren't supported by Prettier. There was already an open issue in Prettier where spaces between parens and brackets were proposed, but it was rejected.

Possible Solutions

• We can try to use ESLint plugin for prettier formatting, which adds autofixable prettier rule. If you run eslint with the --fix flag, your code will be formatted according to prettier style. It might get into conflicts with other rules, so it might not work as expected with spaces. See also this related article from @neciu to find out more.
• Automattic maintains Prettier fork that is used with Calypso which respects spaces between parens and brackets. We could use this fork or even better try to merge those changes back into Prettier.