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")
都是用于生成绝对路径的,但它们的基础路径不同。
-
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'
是相对于当前模块目录的路径。
path.resolve("./src")的基础路径是
相对于当前工作目录(脚本执行的目录)的路径:
"./src"
是相对于当前工作目录的路径。- 例如,如果当前工作目录是
/home/user/project
,那么path.resolve("./src")
将会返回/home/user/project/src;
如果当前模块的路径是/home/user
,则会返回回/home/user/src
。
所以,主要区别在于基础路径不同。使用 __dirname
通常更安全,因为它是当前模块的目录,不受工作目录的影响。而使用相对路径可能受到工作目录的影响,因为工作目录可能会在不同的执行环境中变化。