Prettier

FIAS shablonlari Prettier bilan to‘liq sozlangan holda keladi. Bu barcha kodlarda bir xil formatni ta’minlaydi va ESLint, Husky, va lint-staged bilan uyg‘un ishlaydi. Har bir git commit oldidan kod avtomatik tarzda tekshiriladi va tozalanadi.

Prettier

⚙️ Konfiguratsiya Tafsilotlari

🔧 Prettier qoidalari (Next.js uchun prettier.config.cjs, React uchun .prettierrc)

/** @type {import("prettier").Config} */
module.exports = {
  semi: true,             // Har bir operator ; bilan tugashi shart
  singleQuote: true,      // " o‘rniga ' ishlatiladi
  trailingComma: 'all',   // Object va massivlarda vergul oxiridan tashlanmaydi
  tabWidth: 2,            // 2 probel — tab size
  bracketSpacing: true,   // Ob'ektlar ichida bo‘sh joylar saqlanadi: { a: 1 }
  arrowParens: 'always',  // Arrow function’da har doim (x) => x
};

React.js loyihalarida yuqoridagi konfiguratsiya JSON formatida:

{
  "semi": true,
  "singleQuote": true,
  "trailingComma": "all",
  "tabWidth": 2,
  "bracketSpacing": true,
  "arrowParens": "always"
}

🔁 Husky va Lint-Staged bilan Avtomatlashtirish

🧩 lint-staged Konfiguratsiyasi (package.json ichida)

"lint-staged": {
  "*.{js,ts,jsx,tsx}": [
    "prettier --write",
    "eslint src --fix"
  ]
}

🔹 Ushbu sozlama faqat o‘zgartirilgan fayllarni formatlaydi va lint qiladi:

  • Prettier bilan formatlanadi

  • ESLint bilan aniqlangan xatolar avtomatik tuzatiladi


🔐 Husky Git Hook’lari

  • Husky prepare skript orqali ishga tushadi:

"scripts": {
  "prepare": "husky"
}
  • .husky/ papkasida Git hook fayllari (masalan: pre-commit) joylashgan bo‘ladi.


🛠️ Maxsus NPM Skriptlar

Quyidagi skriptlar yordamida siz Prettier va ESLint’ni qo‘lda ham ishga tushirishingiz mumkin:

"scripts": {
  "prettier": "prettier src --write",
  "lint": "eslint src --fix",
  "prepare": "husky"
}
  • npm run prettiersrc/ katalogidagi barcha fayllarni Prettier bilan formatlaydi.

  • npm run lintsrc/ katalogidagi lint xatolarni tuzatadi.

  • npm run prepare – Husky hook’larini o‘rnatadi (bu avtomatik npm install dan keyin chaqiriladi).


✅ Xulosa

  • Kodni avtomatik tartibga solish Prettier orqali

  • 🧠 Kod sifatini nazorat qilish ESLint orqali

  • 🔐 Har bir commit oldidan tekshirish Husky va lint-staged orqali

Last updated