Vue设置别名联想路径即@/生效的方法

 更新时间:2023年11月02日 08:47:48   作者:xyy123  
这篇文章主要给大家介绍了Vue设置别名联想路径即@/生效的方法,文中有详细的代码示例和图文讲解,具有一定的参考价值,需要的朋友可以参考下

配置

设置联想提示

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

{
    // 联想提示
    "compilerOptions":{
        "baseUrl":"./",
        "paths":{
            "@/*":[
                "src/*"
            ]
        }
    }
}

设置路转换

将 @ 映射为 ./src

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 目录下

以上就是Vue设置别名联想路径即@生效的方法的详细内容,更多关于Vue设置别名联想路径的资料请关注脚本之家其它相关文章!

相关文章

  • 手动实现vue2.0的双向数据绑定原理详解

    手动实现vue2.0的双向数据绑定原理详解

    这篇文章主要给大家介绍了关于手动实现vue2.0的双向数据绑定原理的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-02-02
  • Axios代理配置及封装响应拦截处理方式

    Axios代理配置及封装响应拦截处理方式

    这篇文章主要介绍了Axios代理配置及封装响应拦截处理方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • 一文详解如何在vue中实现文件预览功能

    一文详解如何在vue中实现文件预览功能

    很多Vue项目中都需要PDF文件预览功能,比如合同ERP,销售CRM,内部文档CMS管理系统,内置PDF文件在线预览功能,下面这篇文章主要给大家介绍了关于如何在vue中实现文件预览功能的相关资料,需要的朋友可以参考下
    2022-10-10
  • Vue.directive()的用法和实例详解

    Vue.directive()的用法和实例详解

    这篇文章主要介绍了Vue.directive()的用法和实例 ,需要的朋友可以参考下
    2018-03-03
  • vue-cli创建项目时由esLint校验导致报错或警告的问题及解决

    vue-cli创建项目时由esLint校验导致报错或警告的问题及解决

    这篇文章主要介绍了vue-cli创建项目时由esLint校验导致报错或警告的问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-05-05
  • vue实现自定义全局右键菜单

    vue实现自定义全局右键菜单

    这篇文章主要为大家详细介绍了vue实现自定义全局右键菜单,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04
  • vite+vue3搭建的工程实现批量导入store的module

    vite+vue3搭建的工程实现批量导入store的module

    这篇文章主要介绍了vite+vue3搭建的工程实现批量导入store的module方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-03-03
  • vue 保留两位小数 不能直接用toFixed(2) 的解决

    vue 保留两位小数 不能直接用toFixed(2) 的解决

    这篇文章主要介绍了vue 保留两位小数 不能直接用toFixed(2) 的解决操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-08-08
  • vue.js调用python脚本并给脚本传数据

    vue.js调用python脚本并给脚本传数据

    在有些情况下需要使用不同的语言来完成一个项目,因此就有可能出现不同语言的程序之间的相互调用,下面这篇文章主要给大家介绍了关于vue.js调用python脚本并给脚本传数据的相关资料,需要的朋友可以参考下
    2024-03-03
  • vue元素样式实现动态改变方法介绍

    vue元素样式实现动态改变方法介绍

    vue通过js动态修改元素的样式,如果是固定的几个样式,我常用的是绑定元素的calss,给不同的class写好需要的样式,js控制是否使用这个class
    2022-09-09

最新评论