工具 – ESLint, Stylelint, Prettier

前言

以前在 Webpack 学习笔记 有稍微介绍过它们。这篇是单独整理版。

简单介绍

ESLint 是 JS / TS 代码检查器。它用于保证代码质量，通过 2 个方式

1. 统一格式 (formating)

比如是使用 single quote 还是使用 double quote？

2. code quality

比如 function declare 了一个 parameter，但 function 内却完全没有调用到。（这通常是因为忘记移除）

这些都会被检测出来。这样在代码提交前就可以进行修改，保证代码质量。

Stylelint 也是这类检查器，它用于 CSS / Sass

Prettier 只是单纯做 formatting，没有管 code quality。它不仅仅用于 JS、CSS，还用在很多其它语言，比如 HTML、GraphQL、JSON 等等

Prettier vs ESLint & Stylelint

Prettier 的 formatting 功能和 ESLint、Stylelint 是重叠。

ESLint 比较可以 customize 规范，而且它通常比较宽松，只要格式正确就算过了，未必要统一。

Prettier 比较“固执”，格式必须统一只用一个，而且许多格式是官方规定的，我们甚至不能修改，只能跟随官方的格式。