TypeScript 项目的基本结构
一个典型的 TypeScript 项目（尤其是使用现代工具链的）会有清晰的目录结构和核心配置文件。下面以一个标准的前端或 Node.js 项目为例，介绍常见的基本结构。
1. 典型目录结构（推荐）
my-ts-project/
├── src/ # 源码目录（所有 .ts 或 .tsx 文件放在这里）
│ ├── index.ts # 入口文件（Node.js）或 main.ts
│ ├── app.ts # 主要逻辑
│ ├── utils/ # 工具函数
│ │ └── helper.ts
│ ├── types/ # 自定义类型、接口（可选）
│ │ └── index.d.ts
│ └── components/ # 如果是前端（如 React），放组件
│ └── Button.tsx
├── public/ # 静态资源（前端项目，如 index.html）
│ └── index.html
├── dist/ # 编译输出目录（tsc 编译后生成，不要手动修改）
├── node_modules/ # 依赖包
├── .gitignore
├── package.json # 项目元数据和依赖
├── tsconfig.json # TypeScript 核心配置文件（最重要！）
└── README.md- src/：所有 TypeScript 源代码都放在这里，便于管理和编译。
- dist/：运行
tsc后生成的纯 JavaScript 文件，通常部署这个目录。 - 对于 React + Vite 项目，结构类似，但可能有
vite.config.ts。 - 对于 NestJS 等后端框架，会有
src/main.ts作为入口。
2. 核心文件：tsconfig.json（必须）
这是 TypeScript 编译器的配置文件，定义了如何编译项目。以下是一个推荐的现代、严格模式基础配置（适用于大多数项目）：
{
"compilerOptions": {
/* 基础选项 */
"target": "ES2022", // 编译目标 JS 版本（可根据需要调整为 ES2020/ESNext）
"module": "ESNext", // 模块系统（Vite/Webpack 用 ESNext，Node 用 CommonJS）
"lib": ["ES2022", "DOM"], // 包含的类型库
/* 严格模式（强烈推荐全部开启） */
"strict": true, // 启用所有严格类型检查
"noImplicitAny": true,
"strictNullChecks": true,
"strictFunctionTypes": true,
"strictBindCallApply": true,
"strictPropertyInitialization": true,
"noImplicitThis": true,
"alwaysStrict": true,
/* 模块解析 */
"moduleResolution": "node", // 或 "nodenext"（Node.js 新模式）
"esModuleInterop": true, // 更好兼容 CommonJS 模块
"resolveJsonModule": true, // 允许 import json 文件
/* 输出控制 */
"outDir": "./dist", // 输出目录
"rootDir": "./src", // 源码根目录
"sourceMap": true, // 生成 .map 文件，便于调试
"removeComments": true, // 移除注释
/* 其他实用选项 */
"skipLibCheck": true, // 跳过第三方库类型检查（加速编译）
"forceConsistentCasingInFileNames": true
},
"include": [
"src/**/*.ts", // 包含所有 src 下的 ts 文件
"src/**/*.tsx" // 如果有 React
],
"exclude": [
"node_modules",
"dist"
]
}3. package.json 中的脚本示例
{
"name": "my-ts-project",
"version": "1.0.0",
"scripts": {
"build": "tsc", // 编译：生成 dist 目录
"build:watch": "tsc --watch", // 监视模式，文件变化自动重编
"start": "node dist/index.js", // 运行编译后的代码
"dev": "ts-node src/index.ts" // 使用 ts-node 直接运行 TS（开发时推荐）
},
"devDependencies": {
"typescript": "^5.9",
"ts-node": "^10.9", // 可直接运行 TS 而不需先编译
"@types/node": "^20.0" // Node.js 类型定义
}
}4. 入门项目快速搭建步骤
- 创建文件夹并初始化：
mkdir my-ts-project && cd my-ts-project
npm init -y- 安装 TypeScript：
npm install -D typescript ts-node @types/node- 生成 tsconfig.json：
npx tsc --init然后手动修改为上面的推荐配置。
- 创建 src/index.ts：
console.log("Hello TypeScript!");
interface User {
name: string;
age: number;
}
const user: User = { name: "Alice", age: 25 };
console.log(user);- 运行：
npm run dev # 或 npx ts-node src/index.ts小结
- 核心三要素：
src/（源码） +tsconfig.json（配置） +package.json（脚本和依赖） - 推荐始终开启
"strict": true，养成良好的类型习惯。 - 中大型项目可引入 ESLint + Prettier 进一步规范代码。
如果您想看特定类型项目的结构（如 React + Vite、Next.js、NestJS、Electron 等），或者需要一个完整可运行的示例仓库结构，请告诉我！
