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+iview实现分页及查询功能
Nov 17 Vue.js
vue自定义插件封装,实现简易的elementUi的Message和MessageBox的示例
Nov 20 Vue.js
解决vue页面刷新,数据丢失的问题
Nov 24 Vue.js
浅谈Vue使用Elementui修改默认的最快方法
Dec 05 Vue.js
vue-video-player 断点续播的实现
Feb 01 Vue.js
如何管理Vue中的缓存页面
Feb 06 Vue.js
vue使用lodop打印控件实现浏览器兼容打印的方法
Feb 07 Vue.js
vue前端和Django后端如何查询一定时间段内的数据
Feb 28 Vue.js
一篇文章学会Vue中间件管道
Jun 20 Vue.js
idea编译器vue缩进报错问题场景分析
Jul 04 Vue.js
vue cli4中mockjs在dev环境和build环境的配置详情
Apr 06 Vue.js
vue动态绑定style样式
Apr 20 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
目录,文件操作详谈―PHP
2006/11/25 PHP
PHP Session_Regenerate_ID函数双释放内存破坏漏洞
2011/01/27 PHP
php通过session防url攻击方法
2014/12/10 PHP
thinkPHP和onethink微信支付插件分享
2019/08/11 PHP
原生javascript实现图片轮播效果代码
2010/09/03 Javascript
浅谈JS原型对象和原型链
2016/03/02 Javascript
js原生跨域_用script标签的简单实现
2016/09/24 Javascript
json定义及jquery操作json的方法
2016/10/03 Javascript
Bootstrap基本布局实现方法详解
2016/11/25 Javascript
想用好React的你必须要知道的一些事情
2017/07/24 Javascript
nodejs基于mssql模块连接sqlserver数据库的简单封装操作示例
2018/01/05 NodeJs
使用express搭建一个简单的查询服务器的方法
2018/02/09 Javascript
vue+element-ui集成随机验证码+用户名+密码的form表单验证功能
2018/08/05 Javascript
vue 中基于html5 drag drap的拖放效果案例分析
2018/11/01 Javascript
js使用文档就绪函数动态改变页面内容示例【innerHTML、innerText】
2019/11/07 Javascript
uni-app 自定义底部导航栏的实现
2020/12/11 Javascript
Python Deque 模块使用详解
2014/07/04 Python
wxPython学习之主框架实例
2014/09/28 Python
python中while循环语句用法简单实例
2015/05/07 Python
理解Python垃圾回收机制
2016/02/12 Python
使用Python编写一个最基础的代码解释器的要点解析
2016/07/12 Python
Python数据可视化编程通过Matplotlib创建散点图代码示例
2017/12/09 Python
浅谈Python使用Bottle来提供一个简单的web服务
2017/12/27 Python
详解python函数的闭包问题(内部函数与外部函数详述)
2019/05/17 Python
python爬虫 猫眼电影和电影天堂数据csv和mysql存储过程解析
2019/09/05 Python
手对手的教你用canvas画一个简单的海报的方法示例
2018/12/10 HTML / CSS
简历中个人自我评价范文
2013/12/26 职场文书
父亲的菜园教学反思
2014/02/13 职场文书
学校党支部承诺书
2015/04/30 职场文书
领导新年致辞2016
2015/07/29 职场文书
2015年教师节感言
2015/08/03 职场文书
2016中秋节问候语
2015/11/11 职场文书
大学生村官驻村工作心得体会
2016/01/23 职场文书
如何在Mac上通过docker配置PHP开发环境
2021/05/29 PHP
MySQL外键约束(Foreign Key)案例详解
2022/06/28 MySQL
MySQL count(*)统计总数问题汇总
2022/09/23 MySQL