Linter، Formatter و کیفیت کد

تفاوت Linter و Formatter

ESLint

npm init @eslint/config@latest
npx eslint .
npx eslint . --fix

eslint.config.js (flat config)

import js from "@eslint/js";
import globals from "globals";

export default [
  js.configs.recommended,
  {
    files: ["**/*.js"],
    languageOptions: { globals: globals.browser },
    rules: {
      eqeqeq: "error",
      "no-console": "warn",
      "prefer-const": "error",
    },
  },
  { ignores: ["dist/"] },
];

• سطح قانون: "off" | "warn" | "error"
• پلاگین‌های رایج: typescript-eslint, eslint-plugin-react-hooks, eslint-plugin-jsx-a11y, eslint-plugin-vue

نمونه‌ی خطاهایی که می‌گیره

var a = 1;            // prefer-const / no-var
if (a == "1") {}      // eqeqeq
const unused = 5;     // no-unused-vars

Prettier

npm i -D prettier
npx prettier --write .
npx prettier --check .       # برای CI

// .prettierrc
{ "semi": true, "singleQuote": false, "printWidth": 80, "trailingComma": "all", "tabWidth": 2 }

# .prettierignore
dist
node_modules

مزیت: بحث سر سلیقه در code review از بین می‌ره.

Biome

ابزار واحد (Rust) برای lint + format، بسیار سریع و تک‌پیکربندی:

npm i -D @biomejs/biome
npx biome check --write .

ادغام در گردش کار

ویرایشگر

افزونه‌های ESLint و Prettier در VS Code + «Format on Save».

Git hooks (قبل از commit)

npm i -D husky lint-staged
npx husky init

// package.json
{
  "lint-staged": {
    "*.{js,ts,tsx}": ["eslint --fix", "prettier --write"],
    "*.{css,md,json}": "prettier --write"
  }
}

# .husky/pre-commit
npx lint-staged

CI

- run: npm run lint
- run: npx prettier --check .
- run: npm test

EditorConfig

# .editorconfig
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
insert_final_newline = true

سایر ابزارهای کیفیت

• Stylelint: لینت CSS
• Code review: PR و بازبینی
• Refactoring: تغییر ساختار بدون تغییر رفتار؛ با تست‌ها امن می‌شه (تست)
• مستندسازی: JSDoc/TSDoc، Storybook، Docusaurus، VitePress
• Conventional Commits + commitlint

تمرین

۱. ESLint و Prettier رو روی یک پروژه فعال کن و --fix بزن. ۲. با husky + lint-staged مانع commit کدی بشو که lint نمی‌گذره.