JS 项目迁移 TS 指南

把 JavaScript 项目迁移到 TypeScript 不是"全有或全无"——可以渐进式、逐文件进行。

学完本章你将： 掌握渐进式迁移策略、allowJs 配置、类型覆盖度追踪。

第一步：添加 TypeScript 编译器

bash

npm install -D typescript @types/node
npx tsc --init

json

// tsconfig.json（迁移友好配置）
{
    "compilerOptions": {
        "target": "ES2020",
        "module": "commonjs",
        "strict": false,          // 先不严格——逐步开启
        "allowJs": true,          // 允许 JS 文件
        "checkJs": false,         // 先不检查 JS
        "outDir": "./dist",
        "rootDir": "./src",
        "esModuleInterop": true,
        "skipLibCheck": true
    },
    "include": ["src/**/*"]
}

第二步：逐文件重命名

bash

# 优先级：底层工具函数 > 类型定义 > 组件
# 先改无依赖的基础模块
mv src/utils/helpers.js src/utils/helpers.ts
# 逐步修复类型错误

第三步：逐步开启 strict

json

{
    "strictNullChecks": true,   // 第一步
    "noImplicitAny": true,      // 第二步
    "strict": true              // 最终目标
}

第四步：追踪进度

bash

# 统计 TS 文件比例
find src -name "*.ts" | wc -l
find src -name "*.js" | wc -l

# 类型覆盖度报告
npx type-coverage --detail

💡 关键原则： 迁移期间用 // @ts-ignore 标记暂无法修复的错误——但要加 TODO 注释和 Issue 追踪。

JS 项目迁移 TS 指南

JS 项目迁移 TS 指南

第一步：添加 TypeScript 编译器

第二步：逐文件重命名

第三步：逐步开启 strict

第四步：追踪进度

🛠️ 学完试试这些工具