第 81 条: 使用 `allowJs` 混合使用 TypeScript 和 JavaScript

要点

对于小项目，你可以一次性从 JavaScript 切换到 TypeScript。但对于大项目，这种"暂停一切"的方式行不通。你需要逐步过渡，这意味着要让 TypeScript 和 JavaScript 共存。

关键就是 allowJs 编译器选项。开启后，TS 和 JS 文件可以互相导入。对 JS 文件该模式极其宽松——除非使用@ts-check（第 80 条），否则只会报语法错误。这是最浅层的"TS 是 JS 超集"的体现。

虽然 allowJs 不太能发现错误，但它让你能在修改代码前先把 TS 引入构建流程。这很有用，因为如第 82 条所述，在转换单个模块为 TS 时你需要能运行测试。

如果你的打包工具支持 TS 或有插件（比如 webpack 安装 ts-loader）：

bash

$: npm install --save-dev ts-loader

然后在 webpack.config.js 配置：

module.exports = {
  module: {
    rules: [{ test: /\.tsx?$/, use: 'ts-loader', exclude: /node_modules/ }],
  },
}

多数测试工具也有类似方案。比如 Jest 安装 ts-jest 后，在 jest.config.js 配置：

module.exports = {
  transform: { '^.+\\.tsx?$': 'ts-jest' },
}

如果是 Node.js 环境，最简单是用 ts-node：

bash

$: node -r ts-node/register main.ts

自定义构建流程会更复杂，但有备用方案：设置 outDir 选项，然后 TS 会生成纯 JS 代码，原有构建流程通常能直接处理。你可能需要调整 target 和 module 等选项使输出贴近原 JS 代码。

虽然配置构建和测试流程不太有趣，但这是安全迁移代码的基础（下条会详述）。