DEV Community

Cover image for Prettier vs ESLint
Mahdi Falamarzi
Mahdi Falamarzi

Posted on

Prettier vs ESLint

Prettier
Image description
Prettier is an opinionated code formatter with support for many languages such as Javascript and many other languages.
In fact, this tool removes all original styling and ensures that all outputted code conforms to a consistent style. Prettier takes your code and reprints it from scratch by taking the line length into account.

Suppose you have a function that receives 4 arguments.

Image description

You agree, it is not very attractive if you are lucky like me and uses this tool, the code will be much more beautiful

Image description

This tool has a configuration file in which the entire code profile is customizable.

Why should every developer use Prettier?
- Building and enforcing a style guide
- Helping Newcomers
- Writing code
- Easy to adopt
- Clean up an existing codebase
- Ride the hype train
- Supports many languages
- Integrates with most editors

ESLint

Image description
But the hand ESLint is a static code analysis tool for identifying problematic patterns found in JavaScript code. It was created by Nicholas C. Zakas in 2013. Rules in ESLint are configurable, and customized rules can be defined and loaded. ESLint covers both code quality and coding style issues. ESLint supports current standards of ECMAScript and experimental syntax from drafts for future standards. Code using JSX or TypeScript can also be processed when a plugin or transpiler is used. in another word ESLint Find and fixes problems in your JavaScript/Typescript code.
The above description is taken from Wikipedia, which clearly explains the work of ESLint. ESLint requires Node.js and works on Windows, Mac and Linux.

Image description

Conclusion
Prettier is a style code formatter that support many languages but ESLint is a tool that finds javascript/typescript issue and gives some special hint to solve them.

Top comments (0)