DCloud_heavensoft
DCloud_heavensoft
  • 发布:2019-05-12 22:42
  • 更新:2024-10-22 17:28
  • 阅读:188183

HBuilderX代码提示系统说明

分类:HBuilderX

本帖文档已集成到: hx产品文档

HBuilderX的代码提示系统很庞大,支持多种语法提示模型。

内置语法库

  • web项目有内置的html、js、css语法库
  • App项目有内置的plus扩展语法库
  • uni-app项目有内置的uni-app语法库
  • 微信小程序、快应用等项目也有对应的内置语法库

js框架语法库(sdocml格式)

HBuilderX中,在可以输入js的文件,比如js、html等文件里,(不含vue、ts),底部状态栏有“语法提示库”,可以加载内置的框架语法库。

其中node.js也是作为一种框架语法而存在的。
勾选相应js框架语法后,js区域即可提示相应语法(初次勾选需要延时几秒后才能使用)

该选择是项目级的,一旦勾选后,整个项目下可以写js的地方都会加载。
如果文件是单独打开,没有在HBuilderX左侧的项目管理器中,则无法使用本功能。

如果HBuilderX能检测到项目下有jquery或mui等常用框架,也会自动给这个项目挂载语法提示库。但有时可能检测不准,需要开发者手动引入。

d.ts

很多框架都内置了d.ts语法提示库。HBuilderX完整支持d.ts的语法提示。
如果项目下有某个框架的d.ts文件,HBuilderX则可以提示这个框架的语法提示。

jsdoc+

jsdoc是以注释方式声明方法、参数、属性,HBuilderX提供了经过扩展的jsdoc+,可实现强大的语法提示,详见:https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/129

vue doc

vue组件开发者,如果想给组件使用者提供更好的使用方式,应该给组件写vue doc。
vue doc是一种类似jsdoc的方式,通过在注释里描述组件的方法、参数、属性。
详见:https://ask.dcloud.net.cn/article/35814

兼容vscode vetur插件中的vue规范

一些vue的组件库,已经按照vetur规范制作语法提示库,比如Element UI、Onsen UI、Bootstrap Vue等框架。
这些框架npm安装是在node_module下会自带一个json语法库,或在HBuilderX新建模板中选择element ui模板安装也会包含该库。有了这个语法库,就可以直接代码提示。如下图

代码块

HBuilderX支持自定义代码块,在菜单工具-代码块设置中可自行扩展。
代码块数据格式兼容vscode,并扩展了更多丰富设置。对于提高开发效率帮助很大。

6 关注 分享
DCloud_HB_WDL 7***@qq.com 9***@qq.com sonicsunsky 1***@qq.com 4***@qq.com

要回复文章请先登录注册

2***@qq.com

2***@qq.com

想问下语法提示按table不能补全input,form标签是什么原因?有些能补全,有些按了没用
2022-03-29 16:46
DCloud_heavensoft

DCloud_heavensoft (作者)

回复 1***@qq.com :
这是自带功能啊,uni.scanCode敲回车,默认就有语法提示。如果是复制回来的代码,在json里按alt+/,也有代码提示,每个对象的每个属性都有。另外hx3.4起,支持了你说的一个功能,对内置api点alt+左键转到定义,也可以看到ts定义了
2022-03-07 02:23
默毅品牌设计

默毅品牌设计

语法提示的ts库 希望能跟进一下
2022-03-05 10:06
1***@qq.com

1***@qq.com

回复 DCloud_heavensoft :
代码块技能get到了,多谢
2022-02-24 10:50
1***@qq.com

1***@qq.com

回复 DCloud_heavensoft :
代码提示里的参数如果是个对象呢,我就只能看到这个对象,具体对象有哪些属性,一概不知,拿这个uni.scanCode为例,给出的参数是(ScanCodeOptions),实际用的时候肯定是要设置对象里的具体属性的,比如这个ScanCodeOptions对象,看文档可以知道是这样的{onlyFromCamera,scanType,success,fail,complete}
2022-02-24 10:49
DCloud_heavensoft

DCloud_heavensoft (作者)

回复 1***@qq.com :
敲view出的提示,是代码块,代码块本身可以自定义。然后如果你不需要class这些属性,应该敲view然后tab。就是因为很多时候要写class,写的累,才增加了这几个代码块,帮大家提升效率。

true、false的问题,由于js是弱类型,只有被明确识别出变量类型是bool,才会有true、false的提示。或者组件的vue doc里声明了它是bool类型。

uni.scanCode,想看啥的源码?这是内置方法,不是工程下自己引的一个三方的库啊,工程下没有源码的。vue那个同理。敲uni.scanCode回车,代码提示里本身是有每个参数的说明的,错过回车的代码提示,也可以按alt+/激活。按f1也可以方便的查看文档。
2022-02-23 17:48
1***@qq.com

1***@qq.com

代码提示确实拉胯,比如我想写一个view组件,直接敲view竟然没有,第一选项就是view_class,第二选项是view for,第三是uview,就是没有view,你说气人不气人;我要给一个属性绑定一个boolean值,并不会给出true或false的选项,我知道怎么拼写,但是我就是不想敲啊。

还有,我调一下 uni.scanCode,参数是什么啊,竟然没法点进去看看源码,只给一个文档链接,我并不想每个不熟悉的方法都去文档看,我只想看代码。

还有这个,import Vue from 'vue',这个Vue是从 vue来的,我能看看vue里是啥吗?又点不进去。唉,头疼。

感觉不像一个IDE,更像一个超级记事本。

以上只是吐槽,不耽误我对HBX的支持,如果只是因为我太小白,还请大佬指点一二。
2022-02-23 16:55
Ling317

Ling317

回复 在烟雾里告白 :
项目不能外部文件夹拖进来,要么是新建的项目,要么是导入本地项目
2022-02-15 17:22
Ling317

Ling317

回复 1***@qq.com :
这个必须是软件新建的项目才可以,外部文件夹拖动进来的项目是无法显示的,提示库不起作用的
2022-02-15 17:18
2***@qq.com

2***@qq.com

请问 有 wxss 的语言提示库吗?
2022-02-12 14:33