Prettier with linters

Jonathan Harrison
Aug 29, 2017 · 1 min read

Recently I started using prettier in my side projects and for those who don’t know what prettier is; it is an opinionated code formatter. I highly encourage you to check it out.

prettier’s documentation is a great place to get started, but when trying to set it up for a “real project” I couldn’t find any complete examples with linters. If not correctly configured, your linter of choice and prettier will be at war about formatting your code.

In my case I was using:

After some digging and playing around, I got the previously mentioned linters playing nice with prettier.

To save the next person who tries to do this a few hours, I thought I would share my minimal setup on GitHub. Simply:

  • Clone the project.
  • Open up one of the folders e.g. tslint.
  • Install the dependencies with npm or yarn.
  • Run the linter command with “npm run lint-ts” or “yarn run lint-ts” (Replace lint-ts with lint-css for stylelint).

If everything worked as expected, you should have some linting errors.

There you go. Happy coding :)

)
Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade