Adding Prettier to a project

prettier.md

Adding Prettier to a Project

Basic steps for adding Prettier to a project and setting up a pre-commit hook when not using any other linter. Most of these steps can be found in the docs and through other links in the docs.

1. Install prettier:

$ npm install --save-dev --save-exact prettier

2. Create an empty config file to let tools know you're using Prettier:

$ echo {}> .prettierrc.json

3. Create a .prettierignore file to let tools know which files NOT to format. node_modules are ignored by default. Some suggestions:

build
coverage
.package-lock.json
*.min.*

4. Manually run Prettier to re-format all the files in the project:

$ npx prettier --write .

5. Set up your code editor to auto-format on save for ease of use. See instructions for various editors.
6. Set up commit hooks with pretty-quick and husky. First, install them as dev dependencies:

$ npm i --save-dev pretty-quick husky

7. Finally, add the pre-commit instructions to your package.json file:

"husky": {
  "hooks": {
    "pre-commit": "pretty-quick --staged"
  }
},

Now when you commit your changes, files in the commit will automatically be formatted!