tsconfig, strict & .d.ts

Một dự án TypeScript được điều khiển bởi tsconfig.json ở thư mục gốc. Chạy npx tsc --init để sinh bản đầy đủ kèm chú thích. Phần quan trọng nhất là compilerOptions:

{
  "compilerOptions": {
    "target": "es2022",
    "module": "nodenext",
    "moduleResolution": "nodenext",
    "strict": true,
    "outDir": "dist"
  }
}

• ▸tsconfig.json đặt ở gốc dự án; tsc tự đọc nó khi chạy không kèm tên file.
• ▸compilerOptions gom mọi tuỳ chọn quan trọng: strict, target, module, outDir...
• ▸npx tsc --init sinh một bản mẫu đầy đủ chú thích để tham khảo.

strict là tuỳ chọn đáng giá nhất - nó bật cả một nhóm kiểm tra nghiêm. Từ TypeScript 6, strict bật mặc định, và bạn nên giữ vậy. Hai cái nó bắt thường xuyên nhất:

function chao(ten) {        // ten ngam thanh 'any'
  return "Xin chao, " + ten;
}

error TS7006: Parameter 'ten' implicitly has an 'any' type.

function dodai(s: string | null): number {
  return s.length;          // s co the la null!
}

error TS18047: 's' is possibly 'null'.

Ba tuỳ chọn hay phải đụng khi dựng dự án, và rất dễ lẫn:

• ▸target: tsc sinh JavaScript theo phiên bản nào (vd es2022) - ảnh hưởng cú pháp trong .js.
• ▸module: dùng hệ module nào khi sinh code (ESM, commonjs, nodenext...).
• ▸moduleResolution: tsc TÌM module thế nào (nodenext cho Node hiện đại, bundler cho Vite/webpack).

Không phải thư viện JavaScript nào cũng kèm kiểu. Một tệp .d.ts (declaration) chỉ MÔ TẢ kiểu, không chứa code chạy, để gắn kiểu cho phần JavaScript chưa có:

// Mo ta kieu cho mot module JS chua co kieu
declare module "mylib" {
  export function tinhTong(a: number, b: number): number;
}

Sau đó import dùng bình thường, TypeScript đã hiểu kiểu. Nhưng trước khi tự viết, hãy kiểm xem cộng đồng đã làm sẵn chưa - kho DefinitelyTyped cung cấp các gói @types/...:

npm install -D @types/node     # kieu cho Node
npm install -D @types/lodash   # kieu cho lodash

• ▸.d.ts chỉ chứa khai báo kiểu (declare), không có code chạy - gắn kiểu cho JS không sửa nguồn.
• ▸@types/... là kiểu do cộng đồng viết ở DefinitelyTyped; cài là dùng được ngay.
• ▸Tự viết .d.ts chỉ khi không có @types sẵn cho thư viện đang dùng.

Một chi tiết nhỏ mà hữu ích: import type chỉ nhập KIỂU, và bị xoá hết khi biên dịch - đúng tinh thần type erasure ở Bài 1, nên không sinh ra import JavaScript thừa lúc chạy:

import type { Meo } from "./meo";   // chi lay kieu, bi xoa khi bien dich
import { taoMeo } from "./meo";     // import gia tri thuong (con lai luc chay)