从零构建高效技能目录结构：新手避坑指南与最佳实践

5次阅读

共计 1252 个字符，预计需要花费 4 分钟才能阅读完成。

作为一名刚入门的开发者，你可能觉得把代码文件随便放一放也无所谓，反正能跑就行。但当你接手一个大型项目，或者你的小型项目逐渐膨胀时，混乱的目录结构会让你痛不欲生。我曾经就因为这个问题，花了一整天时间只为了找到一个特定的工具函数在哪里定义。

常见的新手问题包括：

文件散乱在项目根目录，没有分类
循环依赖问题（A 依赖 B，B 又依赖 A）
命名不一致（有的用 camelCase，有的用 snake_case）
过度嵌套（找到文件要点击七八层文件夹）
测试文件和源代码混在一起

按功能划分 （Feature-based）
优点：高度内聚，功能模块自包含
缺点：可能导致重复代码
适用场景：大型复杂应用
按类型划分 （Type-based）
优点：结构清晰，易于查找
缺点：功能分散，修改需要跨目录
适用场景：小型到中型项目
混合模式
结合前两者优点，通常是顶层按类型划分，深层按功能划分
适用场景：大多数中等规模项目

my-project/
├── src/
│   ├── features/          # 功能模块
│   │   ├── auth/          # 认证相关
│   │   └── dashboard/     # 仪表板相关
│   ├── lib/               # 共享工具库
│   ├── styles/            # 全局样式
│   └── App.js             # 应用入口
├── tests/                 # 测试代码
├── config/                # 配置文件
└── package.json

// src/features/auth/authService.js
export default class AuthService {// 认证相关业务逻辑}

// src/lib/httpClient.js
export function createHttpClient(config) {// 创建 HTTP 客户端}

// src/App.js
import AuthService from './features/auth/authService';
import {createHttpClient} from './lib/httpClient';

// 使用导入的模块