TypeScript Academy · Pelajaran

Strategi Konversi File demi File

Ubah nama .js menjadi .ts secara bertahap tanpa merusak apa pun.

Strategi Konversi File demi File adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 3 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar TypeScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus TypeScript Academy mencakup 4 pelajaran total.

Pendekatan Inkremental

Konversi berkas demi berkas mengganti nama satu .js menjadi .ts pada satu waktu, sambil memperbaiki kesalahan tipe. Dengan demikian, proyek tetap dapat dikompilasi di setiap langkah.

# Step 1: rename
mv src/utils.js src/utils.ts
# Step 2: fix errors
npx tsc --noEmit
# Step 3: commit and repeat

Menentukan Titik Awal

Mulailah dengan modul daun—berkas yang tidak mengimpor berkas lain dari proyek. Modul ini tidak memiliki dependensi TypeScript hilir yang perlu dipenuhi terlebih dahulu.

# Find files with fewest imports from other project files:
grep -r "from './" src --include="*.js" | sort | uniq -c | sort -n
# Convert lowest-count files first

Menangani Kesalahan any Implisit

Ketika berkas JS diganti namanya menjadi .ts, parameter tanpa tipe menjadi kesalahan any implisit jika noImplicitAny: true. Tambahkan tipe eksplisit atau gunakan any untuk sementara.

// Before: JS
function process(data) { return data.value; }

// After: TS (add annotation)
function process(data: { value: string }) { return data.value; }
// Or temporarily:
function process(data: any) { return data.value; }

Menyembunyikan Kesalahan Sementara

Gunakan // @ts-ignore pada baris yang sulit diperbaiki dan catat sebagai TODO agar tidak terlupakan.

// TODO: type this properly in follow-up PR
// @ts-ignore
const result = complexLegacyFunction(x);

Memperbarui Pernyataan Impor

Ketika sebuah berkas menjadi .ts, berkas yang menggunakannya mungkin memerlukan impor yang diperbarui. TypeScript menyelesaikan berkas .ts secara otomatis tanpa ekstensi berkas dalam jalur impor.

// No extension needed — TypeScript finds .ts
import { process } from "./utils";

Mengonversi Require Pihak Ketiga

Ganti pemanggilan require CommonJS dengan sintaks import modul ES selama konversi agar sesuai dengan resolusi modul TypeScript.

// Before: CommonJS
const fs = require("fs");
// After: ES module
import fs from "fs";

Perkembangan Mode Ketat

Aktifkan penanda mode ketat secara bertahap per berkas menggunakan komentar // @ts-strict-ignore per berkas atau dengan bermigrasi ke tsconfig terpisah yang mengaktifkan mode ketat.

// tsconfig.strict.json — points to converted files only
{
  "extends": "./tsconfig.json",
  "compilerOptions": { "strict": true },
  "include": ["src/converted/**/*"]
}

Melacak Berkas yang Tersisa

Gunakan daftar periksa atau skrip untuk menghitung berkas .js yang tersisa dan melacak kemajuan migrasi dari waktu ke waktu.

find src -name "*.js" | wc -l   # remaining JS files
find src -name "*.ts" | wc -l   # converted TS files

Menghindari PR Besar

Konversikan satu berkas per PR agar peninjauan tetap mudah dikelola. Migrasi TypeScript yang besar lebih mudah ditinjau dan dikembalikan ketika cakupannya dibatasi pada berkas individual.

# Good: one file per PR
# Bad: 50 files renamed in one PR

Menjalankan Pengujian Setelah Setiap Konversi

Jalankan rangkaian pengujian setelah setiap konversi berkas untuk menemukan regresi saat berjalan yang mungkin tidak ditemukan oleh pemeriksa tipe TypeScript.

npm test
# Ensure all tests pass after each .js → .ts rename

Ringkasan: Strategi Berkas demi Berkas

Konversikan berkas daun terlebih dahulu, perbaiki atau sembunyikan kesalahan, jaga agar proyek tetap dapat dikompilasi di setiap langkah, lacak berkas JS yang tersisa, dan kirimkan satu berkas per PR agar peninjauan mudah dikelola.

Pemeriksaan Singkat

Berkas mana yang harus Anda konversi ke TypeScript terlebih dahulu dalam migrasi berkas demi berkas?

Yang Anda Pelajari

Migrasi berkas demi berkas: mulailah dengan modul daun, ganti nama menjadi .ts, perbaiki atau sembunyikan kesalahan, jaga agar proyek tetap dapat dikompilasi, dan lacak kemajuan. Konversi kecil per PR membuat migrasi aman dan mudah ditinjau.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Strategi Konversi File demi File” gratis?

Ya — teks lengkap “Strategi Konversi File demi File” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus TypeScript Academy, upgrade ke CoddyKit PRO. Kursus TypeScript Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Strategi Konversi File demi File”?

Ubah nama .js menjadi .ts secara bertahap tanpa merusak apa pun. Kamu berlatih TypeScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai TypeScript Academy?

Tidak diperlukan pengalaman sebelumnya. TypeScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 4.

Berapa lama pelajaran “Strategi Konversi File demi File” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

Memulai Migrasi: allowJs dan checkJs
Anotasi Tipe JSDoc sebagai Penghubung
Strategi Konversi File demi File
Menangani Pustaka Pihak Ketiga Tanpa Tipe

← Kembali ke TypeScript Academy