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

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'
相关推荐
qq_4244091912 分钟前
uniapp的app项目,某个页面长时间无操作,返回首页
前端·vue.js·uni-app
我在北京coding12 分钟前
element el-table渲染二维对象数组
前端·javascript·vue.js
布兰妮甜14 分钟前
Vue+ElementUI聊天室开发指南
前端·javascript·vue.js·elementui
SevgiliD14 分钟前
el-button传入icon用法可能会出现的问题
前端·javascript·vue.js
我在北京coding15 分钟前
Element-Plus-全局自动引入图标组件,无需每次import
前端·javascript·vue.js
鱼 空18 分钟前
解决el-table右下角被挡住部分
javascript·vue.js·elementui
01传说2 小时前
vue3 配置安装 pnpm 报错 已解决
java·前端·vue.js·前端框架·npm·node.js
sunbyte3 小时前
50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | DoubleVerticalSlider(双垂直滑块)
前端·javascript·css·vue.js·vue
拾光拾趣录5 小时前
虚拟DOM
前端·vue.js·dom
合作小小程序员小小店5 小时前
web网页,在线%食谱推荐系统%分析系统demo,基于vscode,uniapp,vue,java,jdk,springboot,mysql数据库
vue.js·spring boot·vscode·spring·uni-app