vscode怎么设置Vue别名路径智能提示?

发布时间 - 2020-09-04 00:00:00    点击率:

当使用 Vue 框架进行项目开发时,在 vue.config.js 中配置好了路径别名后,到其他页面引入组件、引入 css 、引入静态文件路径时,使用路径别名不会智能提示路径。虽然在 vscode 中安装了 Path Intellisense 插件,但是并无作用。这样容易出现路径拼写错误的低能问题,同时也会造成开发效率降低

相关推荐:《vscode基础教程》、《vue教程》

解决方案

  • 在项目 package.json 所在同级目录下创建文件 jsconfig.json, 来解决别名路径不提示的问题。(配置完保存文件后需要重启编辑器才能生效。而且它只能识别 .vue.js结尾的文件,css文件与其他的静态文件依然没有提示, 不推荐!!!

// .jsconfig.json  
{  
    "compilerOptions": {  
        "baseUrl": ".",  
        "paths": {  
            "@/\*": \['src/\*'\],  
            "a/\*": \["src/assets/\*"\],  
            "c/\*": \["src/components/\*"\],  
            ...  
        }  
     },  
    "include": \["./src/\*\*/\*.vue", "./src/\*\*/\*.js"\], 
    "exclude": \["node\_modules"\]  
}
  • 在 vscode 的 setting.json 中给 Path Intellisence 配置(该方案是最优选,能识别任意格式文件,覆盖率最广。当别名发生改变时只需修改配置即可)

// setting.json  
"path-intellisense.mappings": {  
    "a": "${workspaceRoot}/src",  
    "c": "${workspaceRoot}/src/components",  
    ...  
}

更多编程相关知识,请访问:编程教学!!


# vscode  # vue  # 好了  # 也会  # 只需  # 重启  # 装了  # 编辑器  # 相关知识  # 最广  # 中安  # 保存文件 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 百度浏览器ai对话怎么关 百度浏览器ai聊天窗口隐藏  佛山企业网站制作公司有哪些,沟通100网上服务官网?  JavaScript实现Fly Bird小游戏  Laravel怎么调用外部API_Laravel Http Client客户端使用  如何实现建站之星域名转发设置?  Laravel如何使用Seeder填充数据_Laravel模型工厂Factory批量生成测试数据【方法】  Laravel PHP版本要求一览_Laravel各版本环境要求对照  创业网站制作流程,创业网站可靠吗?  如何快速选择适合个人网站的云服务器配置?  Laravel如何使用Service Container和依赖注入?(代码示例)  Laravel如何使用Telescope进行调试?(安装和使用教程)  HTML 中如何正确使用模板变量为元素的 name 属性赋值  如何在 Go 中优雅地映射具有动态字段的 JSON 对象到结构体  Android中AutoCompleteTextView自动提示  Linux系统命令中screen命令详解  潮流网站制作头像软件下载,适合母子的网名有哪些?  Laravel怎么实现搜索功能_Laravel使用Eloquent实现模糊查询与多条件搜索【实例】  今日头条AI怎样推荐抢票工具_今日头条AI抢票工具推荐算法与筛选【技巧】  phpredis提高消息队列的实时性方法(推荐)  制作ppt免费网站有哪些,有哪些比较好的ppt模板下载网站?  在线ppt制作网站有哪些软件,如何把网页的内容做成ppt?  如何彻底删除建站之星生成的Banner?  Laravel如何保护应用免受CSRF攻击?(原理和示例)  如何在景安云服务器上绑定域名并配置虚拟主机?  Mybatis 中的insertOrUpdate操作  香港服务器WordPress建站指南:SEO优化与高效部署策略  Laravel如何使用Eloquent进行子查询  如何在 Python 中将列表项按字母顺序编号(a.、b.、c. …)  Laravel如何获取当前登录用户信息_Laravel Auth门面使用与Session用户读取【技巧】  百度浏览器如何管理插件 百度浏览器插件管理方法  如何快速生成可下载的建站源码工具?  怎么用AI帮你为初创公司进行市场定位分析?  google浏览器怎么清理缓存_谷歌浏览器清除缓存加速详细步骤  动图在线制作网站有哪些,滑动动图图集怎么做?  谷歌浏览器下载文件时中断怎么办 Google Chrome下载管理修复  canvas 画布在主流浏览器中的尺寸限制详细介绍  如何在IIS中配置站点IP、端口及主机头?  Laravel怎么实现前端Toast弹窗提示_Laravel Session闪存数据Flash传递给前端【方法】  Laravel怎么实现搜索高亮功能_Laravel结合Scout与Algolia全文检索【实战】  长沙企业网站制作哪家好,长沙水业集团官方网站?  EditPlus中的正则表达式 实战(4)  手机软键盘弹出时影响布局的解决方法  html5audio标签播放结束怎么触发事件_onended回调方法【教程】  Laravel如何处理跨站请求伪造(CSRF)保护_Laravel表单安全机制与令牌校验  免费视频制作网站,更新又快又好的免费电影网站?  Laravel如何配置和使用队列处理异步任务_Laravel队列驱动与任务分发实例  EditPlus中的正则表达式实战(6)  如何用wdcp快速搭建高效网站?  中山网站制作网页,中山新生登记系统登记流程?  如何在万网自助建站平台快速创建网站?