TypeScript Academy · Pelajaran

ESLint + @typescript-eslint

Sediakan ESLint dengan pemalam @typescript-eslint untuk mengesan isu berkaitan jenis dan menguatkuasakan gaya yang konsisten.

Pelajaran 1 daripada 38 langkah

ESLint + @typescript-eslint ialah pelajaran TypeScript Academy percuma di CoddyKit. Ini ialah pelajaran 1 daripada 3. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran TypeScript Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus TypeScript Academy merangkumi sejumlah 3 pelajaran.

Pengenalan

Matlamat: Gunakan ESLint dengan @typescript-eslint untuk mengesan pepijat dan menguatkuasakan gaya dalam projek TypeScript.

Pasang

Pasang ESLint teras serta @typescript-eslint/parser dan @typescript-eslint/eslint-plugin.

npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin

Konfigurasi

Konfigurasikan ESLint untuk menggunakan penghurai TS dan peraturan yang disyorkan. Tambah peraturan khusus projek mengikut keperluan.

// .eslintrc.js
module.exports = {
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint"],
  extends: [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  rules: {
    "@typescript-eslint/no-unused-vars": "warn"
  }
};

Contoh pemeriksaan

ESLint menyerlahkan argumen yang hilang, pemboleh ubah yang tidak digunakan dan isu gaya apabila menggunakan penghurai yang memahami TS.

// demo.ts
function greet(name: string) {
  console.log("Hello", name)
}

greet("Ada")

greet() // ESLint error: missing arg

Peraturan berasaskan jenis

Pautkan kepada tsconfig.json dalam parserOptions untuk peraturan yang memerlukan maklumat jenis, contohnya mengesan janji yang tidak dikendalikan.

// tsconfig.json must be linked for type-aware rules
{
  "parserOptions": {
    "project": "./tsconfig.json"
  }
}

// Example: no-floating-promises
async function f() {
  fetch("/api") // ESLint error: unhandled promise
}

Jalankan pemeriksaan

Jalankan ESLint pada pangkalan kod anda. Tambahkan --fix untuk menggunakan pembetulan selamat secara automatik.

npx eslint "src/**/*.{ts,tsx}" --fix

Soalan

Semakan pantas: Mengapa menggunakan @typescript-eslint selain ESLint teras?

Jawab dalam pelajaran interaktif

Imbas kembali

Imbas kembali: Pasang ESLint + @typescript-eslint, konfigurasikan penghurai, lanjutkan peraturan yang disyorkan dan jalankan pemeriksa gaya dengan peraturan berasaskan jenis untuk menghasilkan kod yang kemas.

Percuma untuk bermula

Pelajari TypeScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 101
Pelajaran: 352

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “ESLint + @typescript-eslint” percuma?

Ya — teks penuh “ESLint + @typescript-eslint” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus TypeScript Academy, tingkat taraf kepada CoddyKit PRO. Kursus TypeScript Academy merangkumi sejumlah 3 pelajaran.

Apakah yang akan saya pelajari dalam “ESLint + @typescript-eslint”?

Sediakan ESLint dengan pemalam @typescript-eslint untuk mengesan isu berkaitan jenis dan menguatkuasakan gaya yang konsisten. Anda berlatih TypeScript Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan TypeScript Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran TypeScript Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 1 daripada 3.

Berapa lamakah pelajaran “ESLint + @typescript-eslint” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

ESLint + @typescript-eslint
Penyepaduan Prettier dan konflik peraturan
Set peraturan lazim dunia sebenar

← Kembali ke TypeScript Academy