Vue 设置别名联想路径

配置

设置联想提示

在根目录下添加配置文件jsconfig.json

json 复制代码
{
    // 联想提示
    "compilerOptions":{
        "baseUrl":"./",
        "paths":{
            "@/*":[
                "src/*"
            ]
        }
    }
}

设置路转换

将 @ 映射为 ./src

javascript 复制代码
import {fileURLToPath,URL} from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'


// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve:{
    // 路径转换
    alias:{
      '@':fileURLToPath(new URL('./src',import.meta.url))
    }
  }
})

使用

当使用 @ 时,自动提示并映射到 src 目录下

相关推荐
橘子编程2 分钟前
CSS 全栈指南:从基础到 2025 新特性
前端·css·chrome·tensorflow·less·css3·html5
不会写DN9 分钟前
从依赖到自主:手写一个 ICO 文件转换器
前端·javascript·typescript·node.js
夏暖冬凉14 分钟前
前端大文件上传
前端
Aliex_git14 分钟前
前端监控笔记(一)
前端·笔记·学习
Highcharts.js15 分钟前
Highcharts Grid Lite:企业免费表格数据的基本工具
前端·javascript·信息可视化·免费·highcharts·表格工具
老萬頭17 分钟前
【技术深水区】抖音 WEB 端逆向:从零到一拿下 a_bogus 参数
前端·爬虫·python
程序员小李白18 分钟前
Vue 组件通信 极简速记版
前端·javascript·vue.js
光影少年18 分钟前
跨域问题如何解决?
前端·nginx·前端框架
C澒20 分钟前
微前端容器标准化 —— 公共能力篇:通用监控能力
前端·架构
念念不忘 必有回响21 分钟前
Next.js 14-16 全栈开发实战:从 App Router 核心原理到 Server Actions 深度剖析
前端·nextjs