面试题：TypeScript开发环境的优化与定制

优化TypeScript编译速度

使用 tsconfig.json 配置
- 启用 incremental 编译：在 tsconfig.json 中设置 "incremental": true。增量编译只会重新编译发生变化的文件及其依赖，大大减少编译时间。
- 设置 skipLibCheck：如果项目中使用的第三方库类型声明文件是可靠的，可以设置 "skipLibCheck": true，跳过对库文件的类型检查，加快编译。
- 配置 exclude 和 include：明确指定需要编译的文件或目录，例如 "include": ["src/**/*"], "exclude": ["node_modules", "dist"]，减少不必要文件的编译。
工具链优化
- 使用 swc - typescript：swc 是一个基于Rust的极快的编译器，@swc - typescript 可以替代 tsc 进行TypeScript编译。安装 @swc - core 和 @swc - typescript，并配置相应的构建工具（如 webpack）使用 swc。
- 优化构建工具：
  - 在 webpack 中，使用 thread - loader 可以开启多线程编译TypeScript，提升编译速度。配置如下：

module.exports = {
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: [
          'thread - loader',
          {
            loader: 'ts - loader',
            options: {
              transpileOnly: true
            }
          }
        ]
      }
    ]
  }
};

 - `transpileOnly` 选项会跳过类型检查，仅进行转译，进一步加快编译，但需要配合单独的类型检查流程（如 `tsc --noEmit`）。

定制特定类型检查规则

只对特定目录下文件进行严格的null检查
- 使用 tsconfig.json 的 files 或 include 选项结合 strictNullChecks：
  - 假设要对 src/components 目录下的文件进行严格的null检查，可以在 tsconfig.json 中设置：

{
  "compilerOptions": {
    "strictNullChecks": true
  },
  "include": ["src/components/**/*"]
}

使用 ts - migrate 等工具：ts - migrate 可以帮助逐步迁移项目到严格的类型检查。它允许你为不同目录或文件设置不同的类型检查严格程度。例如，可以先在特定目录下运行 ts - migrate local，按照提示将代码转换为符合严格null检查的模式。
自定义类型检查插件：可以基于 typescript 编译器API编写自定义插件来实现更精细的类型检查控制。例如，编写一个插件来只对特定目录下的文件启用严格的null检查逻辑。以下是一个简单的示例（基于 typescript 编译器API）：

import * as ts from 'typescript';

function createNullCheckPlugin() {
  return {
    name: 'null - check - plugin',
    before: 'tsserver - default',
    visitor: (ctx: ts.TransformationContext) => {
      return (node: ts.Node): ts.Node => {
        // 检查文件路径是否在特定目录下
        const sourceFile = ts.getSourceFile(node);
        if (sourceFile.fileName.includes('src/components')) {
          // 在这里可以添加对null检查相关的类型检查逻辑
          // 例如，对可能为null的变量访问添加警告
        }
        return ts.visitEachChild(node, ctx.visitor, ctx);
      };
    }
  };
}

export default createNullCheckPlugin;

然后在 tsconfig.json 中配置使用该插件：

{
  "compilerOptions": {
    "plugins": [
      {
        "name": "./null - check - plugin"
      }
    ]
  }
}

星途面试题库

面试题：TypeScript开发环境的优化与定制

知识考点

面试题答案

优化TypeScript编译速度

定制特定类型检查规则