Test-Driven React

Beautifying Code with Prettier

Prettier^[29] describes itself as “an opinionated code formatter.” First introduced in 2017, it’s already soared to two million downloads per week from the npm registry. Using Prettier for the first time feels like a breath of fresh air: No more worrying about insignificant stylistic details as you work. No more arguments with your team about what’s most readable. Just let the formatter take care of it.

Let’s add Prettier to our project. Since we’re using ESLint, we want the prettier-eslint command, which ensures that Prettier formats our code in a manner that’s consistent with our ESLint config. To get that command, install the prettier-eslint-cli package:

$ npm install --save-dev prettier-eslint-cli@4.7.1 ...