javascript es modules 原生不支持路径别名，必须通过构建工具（如 vite、webpack）或 node.js 实验性标志配合插件来实现。在浏览器环境中，推荐使用 vite 的 @vitejs/plugin-alias 将 @/ 映射到 src/；在 node.js 环境中，需启用 --experimental-specifier-resolution=node 并使用 vite-node 或自定义加载器处理别名解析。
Vite 项目中如何配置 @ 路径别名
在 Vite 项目中，通过安装 @vitejs/plugin-alias 并在 vite.config.js 中注册该插件，即可实现 @/ 到项目根目录 src/ 的映射。配置完成后，代码中的 import { foo } from '@/utils' 会被自动解析为 ./src/utils.js，无需修改导入语句的其他部分。
import { defineConfig } from 'vite';
import alias from '@vitejs/plugin-alias';
import path from 'path';
export default defineConfig({
plugins: [
alias({
entries: [
{ find: /^@\//, replacement: path.resolve(__dirname, 'src') }
]
})
]
});运行 npx vite build 后，所有引用 @/ 的路径均被正确打包。若未配置此插件，Vite 会抛出 Failed to resolve module specifier '@/utils' 错误。
立即学习“Java免费学习笔记（深入）”；
Node.js 原生 ESM 如何处理路径别名
Node.js 原生 ESM 模块系统不直接支持路径别名，但可通过 vite-node 等运行时工具模拟构建过程，或在启动时注入自定义解析逻辑。使用 vite-node 时，它会自动读取 vite.config.js 中的别名配置，从而在 Node 环境中解析 @/ 路径。若不使用构建工具，需编写自定义 resolveImportMeta 或依赖第三方库如 esm-resolve 来拦截并转换导入路径。
// main.mjs (需通过 vite-node main.mjs 运行)
import { greet } from '@/utils/greet.js';
console.log(greet('World'));执行 npx vite-node main.mjs 可成功输出 Hello, World!。若直接使用 node main.mjs，则会因无法解析 @/ 而报错。此方法适用于需要快速原型验证且不愿引入完整构建流程的场景。
当别名指向的文件不存在时会发生什么
当路径别名指向的文件实际不存在时，构建工具或运行时会在编译或执行阶段抛出明确的模块解析错误。例如，若 @/nonexistent 对应的文件不存在，Vite 会返回 Module not found: Can't resolve '@/nonexistent'，而 vite-node 会抛出 Cannot find module '@/nonexistent'。这些错误信息包含完整路径和别名映射关系，便于开发者快速定位问题。建议在开发阶段启用严格模式，确保所有别名路径均有效。
