Fias
  • FIASga xush kelibsiz!
  • Boshlash
    • Foydalanish
    • Structure
      • Next Js template
      • React Js template
  • Code Styling & linting
    • Prettier
  • ESLint
  • Husky
  • Other
    • Changelog
    • Contributing (Introduction)
      • Kod standartlari
      • Lokalda ishga tushurish
      • Pull request yuborish
      • Xatoliklar va Funksional takliflar
  • Manbalar
Powered by GitBook
On this page
  • ⚙️ Konfiguratsiya Tafsilotlari
  • 🔁 Husky va Lint-Staged bilan Avtomatlashtirish
  • 🔐 Husky Git Hook’lari
  • 🛠️ Maxsus NPM Skriptlar
  • ✅ Xulosa
  1. Code Styling & linting

Prettier

PreviousReact Js templateNextESLint

Last updated 16 days ago

FIAS shablonlari 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.

⚙️ 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 prettier – src/ katalogidagi barcha fayllarni Prettier bilan formatlaydi.

  • npm run lint – src/ 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

Prettier
Prettier