Open3

「ESLintとPrettierってどう違うんだ」っていう人がだいたいわかる2つの違い

泡沫京水泡沫京水

疑問

ESLintとPrettier、どちらもよりコードをよりよくするものだという認識だけど、いったいどう違うんだコレ...?

泡沫京水泡沫京水

ESLintについて

https://eslint.org/
ESLintとは、

ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs.[1]

という文章の通り、「記述されたコードが一貫性を持っているかどうか」を確かめるためのツールです。いわば、コードがコーディングルールなどの規則に従っているかどうかを確かめてくれるコードの監督者です。

脚注
  1. Getting Started with ESLint ↩︎

泡沫京水泡沫京水

Prettierについて

https://prettier.io/
Prettierとは、

What is Prettier?

  • An opinionated code formatter
  • Supports many languages
  • Integrates with most editors
    [1]

Why?

  • Your code is formatted on save
  • No need to discuss style in code review
  • Saves you time and energy
    [1:1]

上記の箇条書きの文章通り、コードのフォーマットを整えてくれるツールです。コードを保存した時点でフォーマットを行ってくれるツール。
テキトーにカタカタやってコード書いても勝手に修正してくれます。
べんり~✨

脚注
  1. https://prettier.io/ ↩︎ ↩︎