WebStorm无法正确识别Vue3组合式API的解决方案


Posted in Vue.js onFebruary 18, 2021

1 问题描述

Vue3的组合式API无法在WebStorm中正确识别,表现为defineComponent等无法被识别:

WebStorm无法正确识别Vue3组合式API的解决方案

2 尝试方案

猜想这种问题的原因是无法正确识别对应的Vue3库,笔者相信WebStorm是可以做到的,只是某些配置没有正确,笔者尝试过在设置的Libraries中勾选上node_modules,但是没有效果。

WebStorm无法正确识别Vue3组合式API的解决方案

3 解决办法

最终的解决办法参考了此处(图源):

WebStorm无法正确识别Vue3组合式API的解决方案

选择node_modules文件夹,右键选择Mark Directory as,最后选择Not Excluded即可。

之后会花费一段时间索引,等待完成即可。

WebStorm无法正确识别Vue3组合式API的解决方案

4 一些思考

看了一下WebStorm的文档,项目中的文件夹总共分为四类:

  • Source:默认选项,所有文件夹默认都被视为Source除非设置为了Tests/Resource Root/Excluded
  • Tests:标记为测试的文件夹
  • Resource Root:资源文件夹,在输入某些需要资源的代码时,比如![](xxxx>),会自动提示该文件夹路径下的资源文件
  • Excluded:代码补全、代码导航等会忽略的文件夹。这个选项能提高WebStorm性能

在设置中搜索Directories可以发现node_modules默认是Excluded:

WebStorm无法正确识别Vue3组合式API的解决方案

标记为Not Excluded后,就不是红色了:

WebStorm无法正确识别Vue3组合式API的解决方案

因此解决并不难,只是无法正确识别的原因。

以上就是WebStorm无法正确识别Vue3组合式API的解决方案的详细内容,更多关于WebStorm无法正确识别Vue3组合式API的资料请关注三水点靠木其它相关文章!

Vue.js 相关文章推荐
vue $router和$route的区别详解
Dec 02 Vue.js
Vue $attrs & inheritAttr实现button禁用效果案例
Dec 07 Vue.js
vue-router定义元信息meta操作
Dec 07 Vue.js
Vue 修改网站图标的方法
Dec 31 Vue.js
手写Vue源码之数据劫持示例详解
Jan 04 Vue.js
基于Vue2实现移动端图片上传、压缩、拖拽排序、拖拽删除功能
Jan 05 Vue.js
vue 实现click同时传入事件对象和自定义参数
Jan 29 Vue.js
vue实现可拖拽的dialog弹框
May 13 Vue.js
vue使用节流函数的踩坑实例指南
May 20 Vue.js
vue项目多环境配置(.env)的实现
Jul 21 Vue.js
vue3.0 数字翻牌组件的使用方法详解
Apr 20 Vue.js
Vue Mint UI mt-swipe的使用方式
Jun 05 Vue.js
如何在 Vue 中使用 JSX
Feb 14 #Vue.js
Vue单页面应用中实现Markdown渲染
Feb 14 #Vue.js
vue仿携程轮播图效果(滑动轮播,下方高度自适应)
Feb 11 #Vue.js
Vue+Bootstrap实现简易学生管理系统
Feb 09 #Vue.js
详解Vue的七种传值方式
Feb 08 #Vue.js
Vue中使用wangeditor富文本编辑的问题
Feb 07 #Vue.js
vue使用lodop打印控件实现浏览器兼容打印的方法
Feb 07 #Vue.js
You might like
DOTA2 1月28日更新:监管系统降临刀塔世界
2021/01/28 DOTA
php代码把全角数字转为半角数字
2007/12/10 PHP
请php正则走开
2008/03/15 PHP
thinkphp 一个页面使用2次分页的实现方法
2013/07/15 PHP
php中strstr、strrchr、substr、stristr四个函数的区别总结
2014/09/22 PHP
php的常量和变量实例详解
2017/06/27 PHP
Centos7.7 64位利用本地完整安装包安装lnmp/lamp套件教程
2021/03/09 Servers
如何用javascript去掉字符串里的所有空格
2007/02/08 Javascript
Jquery练习之表单验证实现代码
2010/12/14 Javascript
js函数获取html中className所在的内容并去除标签
2013/09/08 Javascript
JavaScript获取客户端计算机硬件及系统等信息的方法
2014/01/02 Javascript
jquery动态添加删除一行数据示例
2014/06/12 Javascript
包含中国城市的javascript对象实例
2015/08/03 Javascript
网页前端登录js按Enter回车键实现登陆的两种方法
2016/05/10 Javascript
JavaScript之filter_动力节点Java学院整理
2017/06/28 Javascript
js实现拖拽上传图片功能
2017/08/01 Javascript
Angular2管道Pipe及自定义管道格式数据用法实例分析
2017/11/29 Javascript
详解使用create-react-app快速构建React开发环境
2018/05/16 Javascript
vue发送ajax请求详解
2018/10/09 Javascript
详解VUE里子组件如何获取父组件动态变化的值
2018/12/26 Javascript
jquery获取并修改触发事件的DOM元素示例【基于target 属性】
2019/10/10 jQuery
node.JS路径解析之PATH模块使用方法详解
2020/02/06 Javascript
vue+render+jsx实现可编辑动态多级表头table的实例代码
2020/04/01 Javascript
DWR内存兼容及无法调用问题解决方案
2020/10/16 Javascript
使用js原生实现年份轮播选择效果实例
2021/01/12 Javascript
Python切片用法实例教程
2014/09/08 Python
跟老齐学Python之dict()的操作方法
2014/09/24 Python
探究Python多进程编程下线程之间变量的共享问题
2015/05/05 Python
python数据类型_元组、字典常用操作方法(介绍)
2017/05/30 Python
Python之自动获取公网IP的实例讲解
2017/10/01 Python
通过python调用adb命令对App进行性能测试方式
2020/04/23 Python
Bootstrap File Input文件上传组件
2020/12/01 HTML / CSS
linux面试题参考答案(6)
2014/08/29 面试题
代办社保委托书范文
2014/10/06 职场文书
六查六看六改心得体会
2014/10/14 职场文书
2015年办公室工作总结范文
2015/03/31 职场文书