Lompati ke konten utama
Modul 7 · Pelajaran 1 dari 213/14 dalam kursus~12 min
Pelajaran modul (1/2)

Konfigurasi dengan tsconfig.json

File tsconfig.json menentukan direktori root proyek TypeScript dan opsi kompiler yang diperlukan untuk membangun proyek.

Setiap kali Anda menjalankan tsc di direktori proyek, kompiler mencari file ini untuk memandu perilaku kompilasinya.


Struktur File tsconfig.json

File konfigurasi tipikal terlihat seperti ini:

Code
{
  "compilerOptions": {
    "target": "es2022",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "outDir": "./dist"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

Properti utamanya adalah:

  • compilerOptions: Pengaturan untuk kompiler.
  • include: Menentukan file atau folder yang akan dikompilasi.
  • exclude: Menentukan file atau folder yang akan diabaikan selama kompilasi.

Opsi Kompiler Utama

Berikut beberapa pengaturan terpenting yang perlu diketahui:

  1. target: Menentukan versi keluaran JavaScript oleh kompiler (misalnya, es5, es6/es2015, es2020, esnext).
  2. module: Menentukan sistem modul yang digunakan dalam kode yang dikompilasi (misalnya, commonjs, esnext, node16).
  3. strict: Memungkinkan serangkaian perilaku pemeriksaan tipe yang ketat. Sangat disarankan untuk menyetelnya ke true untuk keamanan jenis maksimum. Ini memungkinkan opsi seperti:
    • noImplicitAny: Menimbulkan kesalahan pada ekspresi dan deklarasi dengan tipe tersirat any ketika tidak ada anotasi tipe yang disediakan.
    • strictNullChecks: Mencegah penetapan null atau undefined ke tipe yang tidak secara eksplisit menyertakannya dalam gabungannya.

Cobalah sendiri

Latihan 1: Menangani strictNullChecks

Latihan#ts.m7.l1.e1
Upaya: 0Memuat…

Di bawah opsi strictNullChecks: true di tsconfig.json, kami tidak dapat menetapkan null atau undefinisi ke tipe primitif. Deklarasikan fungsi bernama parseAge yang menerima input bertipe string | null dan mengembalikan angka jika inputnya bukan null dan merupakan bilangan bulat yang valid, jika tidak maka akan mengembalikan 0. Tangani kasus null secara eksplisit agar lolos kompilasi yang ketat.

Memuat editor…
Tunjukkan petunjuk

Periksa apakah inputnya nol di awal fungsi dan kembalikan 0 segera sebelum memproses string.

Solusi tersedia setelah 3 upaya

Latihan 2: Pengetikan Ketat tanpa Implisit Apa Pun

Latihan#ts.m7.l1.e2
Upaya: 0Memuat…

Di bawah noImplicitAny: true, parameter apa pun yang tipenya tidak dapat disimpulkan harus diketik secara eksplisit. Buat fungsi bernama processItems yang menerima item array (array angka) dan fungsi panggilan balik yang menggunakan satu nomor sebagai argumen dan tidak mengembalikan apa pun. Pastikan untuk tidak menggunakan any dan mengetik semuanya secara eksplisit.

Memuat editor…
Tunjukkan petunjuk

Deklarasikan fungsi dengan fungsi tanda tangan processItems(items: number[], callback: (item: number) => void): void.

Solusi tersedia setelah 3 upaya