es modules中相对路径导入基于当前js文件位置解析，非html页面或url；必须显式写.js扩展名，且“.”“..”需手动计算层级，构建别名如@/在原生esm中无效。
ES Modules 中的相对路径导入，本质是基于当前模块文件所在位置解析的，不是基于 HTML 页面、也不是基于运行时 URL。所谓“相对层级陷阱”，多数源于开发者误判了这个基准点，导致路径写错、404、或意外加载了错误文件。
一、相对路径的基准永远是当前 .js 文件
比如你有如下结构：
- src/
- main.js
- utils/
- api.js
- components/
- Header.js
若 Header.js 想导入 api.js，它必须从自身位置出发向上退两级，再进 utils：
import { fetchUser } from '../utils/api.js'; // ✅ 正确：Header.js → components/ → ../utils/ → api.js
写成 ./utils/api.js 或 /utils/api.js 都会失败——前者在 components 目录下找子目录 utils，后者被当成根路径（只对绝对路径有效，且需服务器支持）。
二、“.” 和 “..” 的行为必须手动数清，不能靠直觉
常见误判场景：
- 在
src/components/Button/Button.js中导入src/utils/helpers.js→ 应写../../utils/helpers.js（退两层到 src，再进 utils） - 在
src/pages/Home.vue（如果用 Vite + `
