📚 ESLint

ESLint — Kod sifatini tekshiruvchi vosita

🔍 Muammo:

• Kodda ko‘plab anti-pattern, unused variables, undefined o‘zgaruvchilar bo‘lishi mumkin
• Bu xatolar runtime’da chiqadi

📘 Nima bu?

• ESLint – bu statik tahlil vositasi, JavaScript/TypeScript kodni yozilish paytida tekshiradi
• rules, plugins va extends orqali sozlanadi

✅ Hal qiladigan muammo:

• Kod sifati oshadi
• Yozilishdagi xatolar erta aniqlanadi
• Yagona kod standarti shakllanadi

ESLint yordamida quyidagilar oldini olasiz:

• var o‘rniga let/const ishlatmaslik,
• kerakmas console.log,
• noto‘g‘ri nomlash,
• importdan foydalanilmaslik,
• ishlatilmagan o‘zgaruvchilar va h.k.

🛠️ Qanday ishlatiladi:

npm install --save-dev eslint
npx eslint --init

Bu sizdan bir nechta savollar so‘raydi:

• Qaysi texnologiyani ishlatyapsiz? (React, Vue, TypeScript, Node va h.k.)

• Kod qayerda ishlaydi? (Browser, Node.js)

• Kod yozish uslubini belgilaysiz (Airbnb, Standard, Prettier integratsiyasi)

• JSON yoki YAML konfiguratsiya tanlaysiz.

• eslint.config.mjs default:

import js from '@eslint/js'
import globals from 'globals'
import tseslint from 'typescript-eslint'
import { defineConfig } from 'eslint/config'

export default defineConfig([
  {
    files: ['**/*.{js,mjs,cjs,ts,mts,cts}'],
    plugins: { js },
    extends: ['js/recommended'],
  },
  {
    files: ['**/*.{js,mjs,cjs,ts,mts,cts}'],
    languageOptions: { globals: globals.browser },
  },
  tseslint.configs.recommended,
])

• eslint.config.mjs misol:

import js from '@eslint/js';
import globals from 'globals';
import tseslint from 'typescript-eslint';
import { defineConfig } from 'eslint/config';
import tsParser from '@typescript-eslint/parser';

export default defineConfig([
  {
    files: ['**/*.{js,mjs,cjs,ts,mts,cts}'],
    languageOptions: {
      parser: tsParser,
      parserOptions: {
        ecmaVersion: 'latest',
        sourceType: 'module',
      },
      globals: globals.browser,
    },
    plugins: {
      '@typescript-eslint': tseslint,
    },
    rules: {
      ...js.configs.recommended.rules,
      ...tseslint.configs.recommended.rules,
      'no-unused-vars': 'warn',
      'no-console': ['error', { allow: ['warn', 'error'] }],
      semi: ['error', 'always'],
      quotes: ['error', 'single'],
    },
  },
]);

• Amalda:

npx eslint . --fix

🎯 Muhim jihatlar:

• Har bir jamoa uchun custom rules tuzish mumkin
• Plugin ekotizimi juda kuchli
• Prettier bilan integratsiya qilish: eslint-config-prettier, eslint-plugin-prettier

🟢 Yutuqlari:

• Katta jamoalarda sifatni boshqarish oson
• Har xil muhitlarda (browser, node) sozlash mumkin
• CI/CDda ishlatilishi mumkin

🔴 Kamchiliklari:

• To‘g‘ri konfiguratsiya qilish uchun vaqt kerak
• Har doim avtomatik tuzatib bo‘lmaydi