vite 项目配置别名 @

第一步,vite 配置
vite.config.ts 文件增加 resolve.alias 配置

import { resolve } from 'path'
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: [{ find: '@', replacement: resolve(__dirname, 'src') }]
  }
})

如果“path”有错误提示, 是因为 TS 找不到类型定义,按照提示安装 “@types/node”后即可
运行命令

npm install --dev @types/node

这时候已经可以使用@别名了

但还不能通过鼠标点击跳转到定义位置,鼠标点击跳转到定义位置需要在 tsconfig.json 中增加配置

    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }

这时候就可以通过鼠标点击跳转到方法或变量定义位置

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容