关于配置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 通常更安全,因为它是当前模块的目录,不受工作目录的影响。而使用相对路径可能受到工作目录的影响,因为工作目录可能会在不同的执行环境中变化。

相关推荐
美狐美颜sdk3 小时前
跨平台直播美颜sdk集成攻略:Android、iOS与Web的统一方案
android·前端·ios
Airser3 小时前
npm启动Taro框架报错
前端·npm·taro
Anlici4 小时前
连载小说大学生课设 需求&架构
前端·javascript·后端
i源4 小时前
Java语言处理Js文件内容格式化
java·javascript
2501_938769994 小时前
React Server Components 进阶:数据预取与缓存
前端·react.js·缓存
“负拾捌”5 小时前
基于NodeJs实现一个MCP客户端(会话模式和无会话模式)
javascript·ai·node.js·大模型·mcp
蒜香拿铁5 小时前
Angular【基础语法】
前端·javascript·angular.js
xiaoxiao无脸男5 小时前
纯css:一个好玩的按钮边框动态动画
前端·css·css3
rookie_fly6 小时前
基于Vue的数字输入框指令
前端·vue.js·设计模式
元直数字电路验证6 小时前
ASP.NET Core Web APP(MVC)开发中无法全局配置 NuGet 包,该怎么解?
前端·javascript·ui·docker·asp.net·.net