NOTE

__dirname变量属于commonjs规范，在esm中没法使用这个变量

esm中的__dirname等价于url.fileURLToPath(import.meta.url)

esm要拼接路径使用url.fileURLToPath(new URL('./relative-path', import.meta.url))

vite 别名

// vite.config.js

import { fileURLToPath } from 'node:url'
import { defineConfig } from 'vite'

// https://vitejs.dev/config/
export default defineConfig({
    resolve: {
        alias: {
            '@hooks': fileURLToPath(new URL('./src/_hooks', import.meta.url))
        }
    }
})

ts 别名

// tsconfig.json

{
    "compilerOptions": {
        "paths": {
            "@hooks/*": ["./src/_hooks/*"]
        }
    }
}

vitepress 别名

// .vitepress/config.ts

import { defineConfig } from 'vitepress'
import { fileURLToPath } from 'node:url'

// https://vitepress.dev/reference/site-config
export default defineConfig({
    vite: {
        resolve: {
            alias: {
                '@hooks': fileURLToPath(new URL('../src/_hooks', import.meta.url))
            }
        }
    }
})

nuxt 别名

官方文档

NOTE

如果使用的是webpack构建工具，图片、CSS等非JS的资源别名配置必须要是~开头

NOTE

在nuxt.config.js中配置的别名，会自动生成到.nuxt/tsconfig.json中，在项目的tsconfig.json中要继承.nuxt/tsconfig.json才能自动补全

import { fileURLToPath } from 'node:url'

export default {
  alias: {
    'images': fileURLToPath(new URL('./assets/images', import.meta.url)),
    'style': fileURLToPath(new URL('./assets/style', import.meta.url)),
    'data': fileURLToPath(new URL('./assets/other/data', import.meta.url))
  }
}

pnpm 别名

参考文档：

• 为终端命令设置alias别名
• pnpm官方文档

在 POSIX 系统上添加永久别名

官方文档说修改.bashrc文件，我试了一下，没有生效，不清楚原因。而修改.bash_profile就可以生效

在git bash终端中，环境是linux环境，在此环境下设置。

方法一：

在C:/Users/xxx/目录下新建.bash_profile，然后输入alias pn=pnpm，保存并退出。

方法二：

在git bash终端输入vim ~/.bash_profile，然后输入alias pn=pnpm，保存并退出。

方法三：

在git安装目录下，找到文件/Git/etc/bash.bashrc，在文件后添加alias pn=pnpm

在 Powershell (Windows) 中添加永久别名：

Powershell我没有添加过，不怎么使用Powershell。

在具有管理员权限的 Powershell 窗口中，执行：

notepad $profile.AllUsersAllHosts

在打开的 profile.ps1 文件中，放入：

set-alias -name pn -value pnpm

保存文件然后关闭窗口。 您可能需要重新打开 Powershell 窗口才能使别名生效。