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中使用Echarts可视化库的完整步骤记录
Nov 18 Vue.js
vue基于Echarts的拖拽数据可视化功能实现
Dec 04 Vue.js
Vue实现小购物车功能
Dec 21 Vue.js
vue实现图书管理系统
Dec 29 Vue.js
vue组件是如何解析及渲染的?
Jan 13 Vue.js
vue实现验证用户名是否可用
Jan 20 Vue.js
如何在Vue项目中添加接口监听遮罩
Jan 25 Vue.js
Vue项目打包部署到apache服务器的方法步骤
Feb 01 Vue.js
vue实现可移动的悬浮按钮
Mar 04 Vue.js
HTML+VUE分页实现炫酷物联网大屏功能
May 27 Vue.js
vue-router中hash模式与history模式的区别
Jun 23 Vue.js
vue实现可以快进后退的跑马灯组件
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
用PHPdig打造属于你自己的Google[图文教程]
2007/02/14 PHP
用PHP和Shell写Hadoop的MapReduce程序
2014/04/15 PHP
php表单提交实例讲解
2015/11/12 PHP
PHP批斗大会之缺失的异常详解
2019/07/09 PHP
php+jQuery ajax实现的实时刷新显示数据功能示例
2019/09/12 PHP
JS代码格式化和语法着色V2
2006/10/14 Javascript
JQuery Tips(4) 一些关于提高JQuery性能的Tips
2009/12/19 Javascript
JS 文件传参及处理技巧分析
2010/05/13 Javascript
深入理解JavaScript系列(2) 揭秘命名函数表达式
2012/01/15 Javascript
js实现图片轮换效果代码
2013/04/16 Javascript
js中对象的声明方式以及数组的一些用法示例
2013/12/11 Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
2015/04/02 Javascript
前端自动化开发之Node.js的环境搭建教程
2017/04/01 Javascript
vue-cli项目中怎么使用mock数据
2017/09/27 Javascript
jQuery实现鼠标响应式淘宝动画效果示例
2018/02/13 jQuery
Vue Element 分组+多选+可搜索Select选择器实现示例
2018/07/23 Javascript
微信小程序滑动选择器的实现代码
2018/08/10 Javascript
详解vantUI框架在vue项目中的应用踩坑
2018/12/06 Javascript
JavaScript 扩展运算符用法实例小结【基于ES6】
2019/06/17 Javascript
解决vue.js中settimeout遇到的问题(时间参数短效果不稳定)
2020/07/21 Javascript
封装Vue Element的table表格组件的示例详解
2020/08/19 Javascript
JavaScript实现随机点名小程序
2020/10/29 Javascript
python基础教程之元组操作使用详解
2014/03/25 Python
Python3基础之条件与循环控制实例解析
2014/08/13 Python
Django中使用Celery的教程详解
2018/08/24 Python
pytorch:model.train和model.eval用法及区别详解
2020/02/20 Python
keras自动编码器实现系列之卷积自动编码器操作
2020/07/03 Python
CSS3 实现图形下落动画效果
2020/11/13 HTML / CSS
会计电算化专业应届大学生求职信
2013/10/22 职场文书
库房主管岗位职责
2013/12/31 职场文书
办公室主任主任岗位责任制
2014/02/11 职场文书
婚礼司仪主持词
2014/03/14 职场文书
大学生演讲稿
2014/04/25 职场文书
检讨书格式
2015/05/07 职场文书
MySQL系列之四 SQL语法
2021/07/02 MySQL
Python中的程序流程控制语句
2022/02/24 Python