ESLint Configuration Package

Giới thiệu

Gói @vuongtt/eslint cung cấp cấu hình ESLint tiêu chuẩn cho các dự án JavaScript và TypeScript. Gói này được thiết kế để dễ dàng tích hợp vào các dự án mới hoặc hiện có, với các tính năng:

• Hỗ trợ đầy đủ cho JavaScript và TypeScript
• Tự động phát hiện cấu hình TypeScript
• Ba mức độ nghiêm ngặt khác nhau (relaxed, standard, strict)
• Tích hợp với các framework phổ biến như NestJS
• Hỗ trợ kiểm tra các file đã thay đổi hoặc đã staged trong git
• Tự động sửa lỗi

Cài đặt

# Sử dụng npm
npm install --save-dev @vuongtt/eslint

# Sử dụng yarn
yarn add --dev @vuongtt/eslint

# Sử dụng pnpm
pnpm add --save-dev @vuongtt/eslint

Sử dụng

Thêm script vào package.json

{
  "scripts": {
    "lint": "midi-lint",
    "lint:fix": "midi-lint",
    "lint:check": "midi-lint --check-only",
    "lint:staged": "midi-lint --staged"
  }
}

Chạy lệnh kiểm tra

# Kiểm tra và tự động sửa lỗi
npm run lint

# Chỉ kiểm tra, không sửa lỗi
npm run lint:check

# Kiểm tra chỉ các file đã staged trong git
npm run lint:staged

Cấu hình

Mức độ nghiêm ngặt

Gói này hỗ trợ ba mức độ nghiêm ngặt khác nhau, có thể cấu hình thông qua biến môi trường MIDI_LINT_PRESET:

• relaxed (mặc định): Ít nghiêm ngặt, phù hợp cho dự án mới
• standard: Mức độ cân bằng
• strict: Nghiêm ngặt nhất, áp dụng tất cả các quy tắc

# Sử dụng mức độ nghiêm ngặt cao
MIDI_LINT_PRESET=strict midi-lint

Tắt kiểm tra type-aware

Mặc định, gói sẽ sử dụng kiểm tra type-aware cho TypeScript nếu tìm thấy file tsconfig.json hoặc tsconfig.eslint.json. Bạn có thể tắt tính năng này bằng cách:

# Tắt kiểm tra type-aware
midi-lint --no-type-aware

# Hoặc sử dụng biến môi trường
MIDI_LINT_NO_TYPEAWARE=1 midi-lint

Các tùy chọn dòng lệnh

| Tùy chọn | Mô tả | |----------|-------| | --check-only | Chỉ kiểm tra, không sửa lỗi | | --no-cache | Tắt cache, buộc kiểm tra lại tất cả các file | | --staged | Chỉ kiểm tra các file đã staged trong git | | --since=<branch> | Chỉ kiểm tra các file đã thay đổi so với nhánh được chỉ định | | --max-warnings=<number> | Đặt số lượng cảnh báo tối đa được phép | | --no-type-aware | Tắt kiểm tra type-aware cho TypeScript |

Quy tắc

Gói này bao gồm các quy tắc từ nhiều plugin ESLint:

• @eslint/js: Quy tắc JavaScript cơ bản
• typescript-eslint: Quy tắc TypeScript
• eslint-plugin-import: Quy tắc về import/export
• eslint-plugin-unused-imports: Phát hiện và xóa import không sử dụng
• eslint-plugin-sonarjs: Quy tắc chất lượng code từ SonarJS
• eslint-plugin-security: Quy tắc bảo mật
• eslint-plugin-n: Quy tắc cho Node.js

Quy tắc cơ bản

• no-console: Cảnh báo khi sử dụng console (ngoại trừ console.warn và console.error)
• no-debugger: Cảnh báo khi sử dụng debugger
• eqeqeq: Yêu cầu sử dụng === và !== thay vì == và !=
• curly: Yêu cầu sử dụng dấu ngoặc nhọn cho tất cả các câu lệnh điều kiện
• unused-imports/no-unused-imports: Phát hiện và báo lỗi khi có import không sử dụng
• unused-imports/no-unused-vars: Cảnh báo khi có biến không sử dụng (bỏ qua biến bắt đầu bằng _)

Quy tắc TypeScript

Khi kiểm tra type-aware được bật, các quy tắc bổ sung sẽ được áp dụng:

• @typescript-eslint/no-explicit-any: Cảnh báo khi sử dụng kiểu any (chỉ trong chế độ strict)
• @typescript-eslint/explicit-function-return-type: Tắt yêu cầu khai báo kiểu trả về cho hàm

Quy tắc đặc biệt cho các loại file

• **/main.ts: Cho phép sử dụng console (hữu ích cho bootstrap ứng dụng)
• **/*.dto.ts, **/*.interface.ts: Cho phép sử dụng kiểu any
• **/*.spec.ts, **/*.test.ts: Nới lỏng một số quy tắc cho file test

Ví dụ

Kiểm tra toàn bộ dự án

midi-lint

Chỉ kiểm tra các file đã thay đổi so với nhánh main

midi-lint --since=origin/main

Kiểm tra với mức độ nghiêm ngặt cao và giới hạn cảnh báo

MIDI_LINT_PRESET=strict midi-lint --max-warnings=10

Kiểm tra các file cụ thể

midi-lint src/components/**/*.tsx

Tích hợp với CI/CD

Thêm lệnh kiểm tra vào quy trình CI/CD:

# Ví dụ với GitHub Actions
jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: '18'
      - run: npm ci
      - run: npm run lint:check

Khắc phục sự cố

Lỗi "No TypeScript configuration found"

Gói sẽ tự động tạo cấu hình TypeScript tạm thời nếu không tìm thấy. Nếu bạn không muốn sử dụng kiểm tra type-aware, hãy sử dụng tùy chọn --no-type-aware.

Quá nhiều cảnh báo

Nếu dự án của bạn có quá nhiều cảnh báo, hãy thử:

1. Sử dụng mức độ relaxed (mặc định)
2. Sửa dần các lỗi, bắt đầu từ các file có nhiều vấn đề nhất
3. Sử dụng --max-warnings để đặt ngưỡng cảnh báo tối đa

Hiệu suất chậm

Nếu quá trình kiểm tra chậm:

1. Đảm bảo cache được bật (mặc định)
2. Chỉ kiểm tra các file đã thay đổi với --staged hoặc --since
3. Tắt kiểm tra type-aware với --no-type-aware nếu dự án lớn