规范ES Modules导入顺序的核心是约定+工具约束，按依赖层级分组：第三方库→内置库→项目抽象层→同级/父级业务模块→当前子模块；同一层按字母序或语义优先级排序，空行分隔，统一使用清晰相对路径。
团队中规范 ES Modules 的导入顺序，核心不是语法强制，而是通过约定 + 工具约束来保障可读性、可维护性和依赖清晰性。ESM 本身不规定 import 的书写顺序，但混乱的导入容易掩盖依赖关系、引发命名冲突、增加重构成本。
按依赖层级分组：从远到近
把 import 按模块“距离”由外向内排列，体现代码的依赖流向：
- 第三方库（如 React、lodash）——最上层，不依赖项目内任何代码
- 内置/标准库（Node.js 中的 fs/path，浏览器中暂无等价物，可略）
- 项目内抽象层（utils、constants、types、config 等通用基础模块）
- 同级或父级业务模块（如 components/ 或 features/ 下的相邻模块）
- 当前模块的子模块（如 ./hooks、./services 子目录）
同一层级内按字母序或语义优先级排序
避免随意换行和跳序，提升扫描效率：
- 命名导出建议按变量/函数名首字母升序，例如：
import { debounce, throttle, once } from 'lodash' - 默认导入也适用，比如：
import ApiClient from './api/client'; import AuthStore from './store/auth';→ 按文件路径字母序更易定位 - 若存在明显主次（如一个入口模块明显主导其他），可将主模块置顶，其余按字母排，不必强求绝对字典序
用空行分隔逻辑区块，禁止单行混写
每个 import 区块职责明确，禁止跨类型挤在一行：
立即学习“Java免费学习笔记（深入）”；
- ✅ 正确示例：
import React from 'react';
import { useState, useEffect } from 'react';
import { apiGetUser } from '@/api/user';
import { formatDate } from '@/utils/date';
import Header from './Header';
import UserCard from './UserCard';
- ❌ 错误示例：把 React 和本地组件写在同一行、或跨空行缺失、或第三方与 utils 混在一起无分隔
统一使用相对路径，禁用深层嵌套别名（除非全团队配置了路径映射）
路径清晰 = 依赖可见，减少歧义：
- 推荐
import Button from '../../components/Button'而非import Button from '@components/Button'（除非已通过 vite/tsconfig.json 配置了baseUrl + paths且全员生效） - 所有相对路径以
./开头，禁用无前缀的someModule（会被识别为包名，易出错） - 避免
../../../超过两级，此时应考虑调整目录结构或提取公共模块
