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 相关文章推荐
vue3.0实现点击切换验证码(组件)及校验
Nov 18 Vue.js
解决vue页面刷新,数据丢失的问题
Nov 24 Vue.js
Vue Elenent实现表格相同数据列合并
Nov 30 Vue.js
Vue3+elementui plus创建项目的方法
Dec 01 Vue.js
vue 数据操作相关总结
Dec 17 Vue.js
vue自定义组件实现双向绑定
Jan 13 Vue.js
WebStorm无法正确识别Vue3组合式API的解决方案
Feb 18 Vue.js
vue实现可移动的悬浮按钮
Mar 04 Vue.js
vue3如何优雅的实现移动端登录注册模块
Mar 29 Vue.js
vue完美实现el-table列宽自适应
May 08 Vue.js
vue使用refs获取嵌套组件中的值过程
Mar 31 Vue.js
vue3引入highlight.js进行代码高亮的方法实例
Apr 08 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
服务器web工具 php环境下
2010/12/29 PHP
for循环连续求和、九九乘法表代码
2012/02/20 PHP
PHP优于Node.js的五大理由分享
2012/09/15 PHP
CodeIgniter多语言实现方法详解
2016/01/20 PHP
Yii配置与使用memcached缓存的方法
2016/07/13 PHP
Avengerls vs KG BO3 第一场2.18
2021/03/10 DOTA
javascript之更有效率的字符串替换
2008/08/02 Javascript
基于jquery的兼容各种浏览器的iframe自适应高度的脚本
2010/08/13 Javascript
Javascript中产生固定结果的函数优化技巧
2013/01/16 Javascript
jquery图片轮播插件仿支付宝2013版全屏图片幻灯片
2014/04/03 Javascript
JavaScript中读取和保存文件实例
2014/05/08 Javascript
Javascript的&&和||的另类用法
2014/07/23 Javascript
jQuery中:visible选择器用法实例
2014/12/30 Javascript
JavaScript中exec函数用法实例分析
2015/06/08 Javascript
js跨浏览器的事件侦听器和事件对象的使用方法
2015/12/17 Javascript
js判断复选框是否选中及选中个数的实现代码
2016/05/30 Javascript
jQuery简单注册和禁用全局事件的方法
2016/07/25 Javascript
Cookbook组件形式:优化 Vue 组件的运行时性能
2018/11/25 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
2020/06/16 Javascript
python显示生日是星期几的方法
2015/05/27 Python
Python中的id()函数指的什么
2017/10/17 Python
windows环境下tensorflow安装过程详解
2018/03/30 Python
python人民币小写转大写辅助工具
2018/06/20 Python
Python3爬虫之urllib携带cookie爬取网页的方法
2018/12/28 Python
Python参数解析模块sys、getopt、argparse使用与对比分析
2019/04/02 Python
Python读写文件模式和文件对象方法实例详解
2019/09/17 Python
python实现小程序推送页面收录脚本
2020/04/20 Python
css3和jquery实现自定义checkbox和radiobox组件
2014/04/22 HTML / CSS
Koral官方网站:女性时尚运动服
2019/04/10 全球购物
以太网Ethernet IEEE802.3
2013/08/05 面试题
食堂员工工作职责
2013/12/18 职场文书
《金孔雀轻轻跳》教学反思
2014/04/20 职场文书
本科毕业论文答辩稿
2015/06/23 职场文书
2015年校本培训工作总结
2015/07/24 职场文书
2019年第四季度财务部门工作计划
2019/11/02 职场文书
Python访问Redis的详细操作
2021/06/26 Python