Cara Mengelola Proyek TypeScript dengan tsconfig

Mengelola proyek TypeScript secara efektif sangat penting untuk menjaga kualitas dan konsistensi kode. File tsconfig.json merupakan bagian utama dalam mengonfigurasi dan mengelola proyek TypeScript. File ini memungkinkan pengembang untuk menentukan berbagai opsi kompiler, penyertaan file, pengecualian, dan banyak lagi. Panduan ini akan menjelaskan cara menggunakan tsconfig.json untuk mengelola proyek TypeScript secara efisien.

Apa itu tsconfig.json?

File tsconfig.json adalah file konfigurasi yang digunakan oleh kompiler TypeScript (tsc) untuk menentukan bagaimana proyek TypeScript harus dikompilasi. File ini menyediakan cara standar untuk menentukan opsi kompiler dan file yang menjadi bagian dari proyek. Jika file tsconfig.json ada di suatu direktori, direktori tersebut akan ditandai sebagai akar proyek TypeScript.

Membuat File tsconfig.json

Untuk membuat file tsconfig.json, jalankan perintah berikut di terminal:

tsc --init

Perintah ini menghasilkan berkas tsconfig.json default dengan serangkaian opsi yang telah ditetapkan sebelumnya. Berkas yang dihasilkan dapat disesuaikan dengan kebutuhan spesifik proyek.

Memahami Properti Dasar tsconfig.json

File tsconfig.json berisi beberapa properti yang dapat disesuaikan untuk mengelola proyek TypeScript dengan lebih baik. Berikut ini adalah beberapa properti yang paling umum digunakan:

• compilerOptions: Menentukan opsi kompiler untuk proyek.
• include: Menentukan file atau direktori yang akan disertakan dalam proyek.
• exclude: Menentukan file atau direktori yang akan dikecualikan dari proyek.
• files: Menentukan file individual yang akan disertakan dalam proyek.

Mengonfigurasi Opsi Kompiler

Properti compilerOptions ​​merupakan bagian terpenting dalam berkas tsconfig.json. Properti ini memungkinkan pengembang untuk mengontrol berbagai aspek dari proses kompilasi. Berikut ini adalah beberapa opsi kompiler yang umum digunakan:

{
  "compilerOptions": {
    "target": "ES6",               // Specifies the target JavaScript version
    "module": "commonjs",          // Specifies the module system
    "strict": true,                // Enables all strict type-checking options
    "outDir": "./dist",            // Redirects output structure to the directory
    "rootDir": "./src",            // Specifies the root directory of input files
    "esModuleInterop": true,       // Enables emit interoperability between CommonJS and ES Modules
    "forceConsistentCasingInFileNames": true // Disallows inconsistently-cased references to the same file
  }
}

Opsi ini dapat disesuaikan berdasarkan persyaratan proyek. Misalnya, mengubah target menjadi ES5 akan menampilkan JavaScript yang kompatibel dengan browser lama.

Menyertakan dan Mengecualikan File

Dalam proyek TypeScript, penting untuk mengontrol file mana yang disertakan atau dikecualikan selama kompilasi. Properti include dan exclude di tsconfig.json digunakan untuk tujuan ini.

{
  "include": ["src/**/*"],    // Includes all TypeScript files in the src folder
  "exclude": ["node_modules", "**/*.spec.ts"] // Excludes node_modules and all spec files
}

Konfigurasi di atas mencakup semua file TypeScript dari direktori src dan subdirektori-subdirektorinya sambil mengecualikan file dalam direktori node_modules ​​dan file dengan ekstensi .spec.ts.

Menggunakan Properti file

Properti files ​​digunakan untuk menyertakan file-file individual dalam kompilasi. Ini berguna jika hanya sekumpulan file tertentu yang perlu dikompilasi.

{
  "files": ["src/index.ts", "src/app.ts"]
}

Dalam contoh ini, hanya file index.ts ​​dan app.ts ​​dari direktori src yang akan dikompilasi.

Memperluas File tsconfig

TypeScript memungkinkan perluasan file tsconfig.json lainnya menggunakan properti extends. Ini berguna untuk berbagi konfigurasi dasar yang sama di beberapa proyek atau subproyek.

{
  "extends": "./base.tsconfig.json",
  "compilerOptions": {
    "outDir": "./dist"
  }
}

Dalam contoh ini, file tsconfig.json saat ini memperluas file base.tsconfig.json dan menimpa opsi outDir.

Kesimpulan

Mengelola proyek TypeScript dengan tsconfig.json memberikan fleksibilitas dan kontrol yang hebat atas proses kompilasi. Dengan memahami dan memanfaatkan berbagai properti tsconfig.json, seperti compilerOptions, include, exclude, dan files, proyek TypeScript dapat dikelola dengan lebih efisien dan efektif. Kemampuan untuk memperluas file tsconfig juga memungkinkan pengorganisasian dan penggunaan ulang proyek yang lebih baik.