Vue中src文件夹别名配置-Vue

修改vite.config.js文件

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
//@ts-ignore
import path from 'path'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': path.resolve('./src'), //相对路径别名配置，使用 @ 符代替src
    },
  },
})

修改tsconfig.js文件，在compilerOptions中增加如下代码。

{
  "compilerOptions": {
    "baseUrl": "./", //解析非相对模块的基地址，默认是当前目录
    "paths": { //路径映射，相对于baseUrl
      "@/*": [
        "src/*"
      ]
    }
  },
}

修改成功后即可在项目中使用；@ 符代表src文件夹，示例：@/components/SvgIcon/index.vue