tsconfig.json tsconfig.app.json tsconfig.node.json 有什么区别

1. tsconfig.json

• 作用：项目的根配置文件，是整个项目的基础配置或默认配置
• 特点：
  • 通常作为所有子配置的 "父配置"，通过extends被其他配置继承
  • 可以定义项目通用的编译选项（如严格模式、类型检查规则等）
  • 当执行tsc命令时，默认会读取此文件
• 典型用途：
  • 存放所有环境共享的基础配置
  • 定义项目整体的包含 / 排除规则（如include: ["src/**/*"]）

{
  "compilerOptions": {
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

2. tsconfig.app.json

• 作用：专门用于应用程序代码（前端业务逻辑）的配置
• 目标环境：浏览器环境
• 特点：
  • 通常会继承tsconfig.json的基础配置
  • 包含浏览器相关的编译选项（如lib: ["DOM", "ESNext"]）
  • 可能启用 JSX 支持（如 React 项目的jsx: "react-jsx"）
  • 仅包含应用源代码目录（如src/）
• 典型用途：
  • 配置前端页面、组件、业务逻辑等代码的编译规则

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "target": "ESNext",
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
    "module": "ESNext",
    "jsx": "react-jsx"
  },
  "include": ["src"]
}

3. tsconfig.node.json

• 作用：专门用于Node.js 环境代码的配置
• 目标环境：Node.js 运行时（如后端代码、工具脚本、配置文件）
• 特点：
  • 同样继承tsconfig.json的基础配置
  • 包含 Node.js 相关的编译选项（如引用@types/node类型）
  • 模块系统通常适配 Node.js（如module: "CommonJS"或NodeNext）
  • 包含工具脚本或配置文件（如vite.config.ts、scripts/）
• 典型用途：
  • 配置项目构建脚本、后端服务、Node.js 工具等代码的编译规则

json

 

 

 

 

 

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "target": "ES2020",
    "lib": ["ESNext"],
    "module": "NodeNext",
    "types": ["node"]
  },
  "include": ["vite.config.ts", "scripts/**/*"]
}

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

核心区别总结