关于配置src别名中的path.resolve(“./src“)

vite.config.ts

复制代码
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      "@": path.resolve("./src") // 相对路径别名配置,使用 @ 代替 src
    }
  }
})

path.resolve 方法用于将路径或路径片段解析为绝对路径。

上面代码中**path.resolve(__dirname, 'src')** 也可以写成 path.resolve("./src") 。两者的区别:

path.resolve(__dirname, 'src')path.resolve("./src") 都是用于生成绝对路径的,但它们的基础路径不同。

  1. path.resolve(__dirname, 'src')的基础路径是 当前模块文件所在的(__dirname所在的目录)绝对路径:

    例如,如果当前模块的路径是 /home/user/project,那么path.resolve(__dirname, 'src') 将会返回 /home/user/project/src;如果当前模块的路径是 /home/user,仍会返回回/home/user/project/src

  • __dirname 是 Node.js 中的一个全局变量,表示当前模块的目录路径。
  • 'src' 是相对于当前模块目录的路径。
  1. path.resolve("./src")的基础路径是 相对于当前工作目录(脚本执行的目录)的路径:
  • "./src" 是相对于当前工作目录的路径。
  • 例如,如果当前工作目录是 /home/user/project,那么path.resolve("./src") 将会返回 /home/user/project/src;如果当前模块的路径是 /home/user,则会返回回/home/user/src

所以,主要区别在于基础路径不同。使用 __dirname 通常更安全,因为它是当前模块的目录,不受工作目录的影响。而使用相对路径可能受到工作目录的影响,因为工作目录可能会在不同的执行环境中变化。

相关推荐
蜡台2 分钟前
uni-indexed-list 之扩展组件实现城市列表带索引查询过滤功能
前端·vue.js·uniapp·uni-indexed
LaughingZhu8 分钟前
Product Hunt 每日热榜 | 2026-06-16
前端·人工智能·经验分享·chatgpt·html
snow@li10 分钟前
前端:构建工具(Vite / Webpack)的 文件指纹(File Hash) 机制 / 浏览器缓存控制
前端·webpack·哈希算法
ayqy贾杰36 分钟前
SpaceX 收购 Cursor,马斯克花600亿美元买了个代码编辑器
前端·人工智能·机器学习
云飞云共享云桌面9 小时前
传统工作站 vs 云飞云共享云桌面:制造业设计云桌面选型深度对比
运维·服务器·前端·网络·3d·架构·制造
UXbot9 小时前
如何选择适合公司项目的UI设计工具?企业选型指南
前端·低代码·ui·团队开发·原型模式·设计规范·web app
llz_1129 小时前
web-第四次课后作业
前端·spring boot·web
武清伯MVP10 小时前
前端跨域方案大合集
前端·javascript
一杯奶茶¥10 小时前
基于springboot的失物招领管理系统带万字文档 校园失物招领管理系统 失物认领管理系统java springboot vue
java·vue.js·spring boot·java项目
小刘|10 小时前
Spring AI Alibaba 集成和风天气 API 实战
java·服务器·前端