vue3+vite搭建后台项目-2项目 src 别名的配置

Gik992023-11-12 9:22

src 别名的配置

在开发项目的时候文件与文件关系可能很复杂，因此我们需要给src文件夹配置一个别名

1.找到// vite.config.ts 文件

typescript 复制代码

mport {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
export default defineConfig({
    plugins: [vue()],
    //添加以下代码
    resolve: {
        alias: {
            "@": path.resolve("./src") // 相对路径别名配置，使用 @ 代替 src
        }
    }
})

2.// tsconfig.json中配置

typescript 复制代码

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

使用案例

typescript 复制代码

import App from '@/App.vue'