Vue组件的文档生成方法及装置与流程

文档序号:20837548发布日期:2020-05-22 17:04阅读:来源:国知局

技术特征:

1.一种vue组件的文档生成方法,其特征在于,包括:

获取vue组件的源代码文件,其中,所述vue组件是组成页面视图的抽象单元;

解析所述源代码文件,生成对应的抽象语法树ast;

遍历所述ast中各个树节点;

根据树节点的节点类型在预设模板文档的描述块中填充所述树节点的节点内容,以生成所述vue组件的描述文档,其中,所述描述文档用于记录所述vue组件中各个对象的属性信息和交互关系。

2.根据权利要求1所述的方法,其特征在于,解析所述源代码文件,生成对应的抽象语法树ast,包括:

读取所述源代码文件中的字符串;

识别所述字符串的字符特征;

根据所述字符串和所述字符特征生成所述vue组件的ast。

3.根据权利要求2所述的方法,其特征在于,根据所述字符串和所述字符特征生成所述vue组件的ast包括:

基于所述字符特征生成token序列,其中,所述token序列包括所述源代码文件中的多个字符串;

根据所述token序列自顶向下构建所述源代码文件的ast,其中,所述token序列中的每个字符串对应一个树节点。

4.根据权利要求2所述的方法,其特征在于,根据所述字符串和所述字符特征生成所述vue组件的ast包括:

基于所述字符特征对所述源代码文件中的多个字符串分别进行词法分析,生成token序列;

对所述token序列进行语法分析,将每个字符串的token转化为树形表达式,以生成所述源代码文件的ast。

5.根据权利要求2所述的方法,其特征在于,识别所述字符串的字符特征包括以下至少之一:

识别所述字符串的props属性;

识别所述字符串的字符标识;

识别所述字符串的注释信息;

识别所述字符串的类型。

6.根据权利要求1所述的方法,其特征在于,根据树节点的节点类型在预设模板文档的描述块中填充所述树节点的节点内容包括:

根据所述树节点的节点类型匹配目标描述块,其中,所述目标描述块包括以下之一:props,events,slots,methods,所述props,所述events,所述slots是所述vue组件中函数的应用编程接口api类型,所述methods是所述vue组件中方法之间的调用类型;

在所述目标描述块中填充所述树节点的节点内容。

7.根据权利要求1所述的方法,其特征在于,在根据所述ast生成所述vue组件的描述文档之后,所述方法还包括:

在设置所述vue组件与所述描述文档的关联关系之后,将所述vue组件上传到javascript组件库。

8.一种vue组件的文档生成装置,其特征在于,包括:

获取模块,用于获取vue组件的源代码文件,其中,所述vue组件是组成页面视图的抽象单元;

解析模块,用于解析所述源代码文件,生成对应的抽象语法树ast;

遍历模块,用于遍历所述ast中各个树节点;

填充模块,用于根据树节点的节点类型在预设模板文档的描述块中填充所述树节点的节点内容,以生成所述vue组件的描述文档,其中,所述描述文档用于记录所述vue组件中各个对象的属性信息和交互关系。

9.根据权利要求8所述的装置,其特征在于,所述解析模块,具体用于:

读取所述源代码文件中的字符串;

识别所述字符串的字符特征;

根据所述字符串和所述字符特征生成所述vue组件的ast。

10.根据权利要求9所述的装置,其特征在于,所述解析模块用于根据所述字符串和所述字符特征生成所述vue组件的ast时,具体用于:

基于字符特征生成token序列,其中,所述token序列包括所述源代码文件中的多个字符串;

根据所述token序列自顶向下构建所述源代码文件的ast,其中,所述token序列中的每个字符串对应一个树节点。

11.根据权利要求9所述的装置,其特征在于,所述解析模块用于根据所述字符串和所述字符特征生成所述vue组件的ast时,具体用于:

基于字符特征对所述源代码文件中的多个字符串分别进行词法分析,生成token序列;

对所述token序列进行语法分析,将每个字符串的token转化为树形表达式,以生成所述源代码文件的ast。

12.根据权利要求9所述的装置,其特征在于,所述解析模块用于识别所述字符串的字符特征时,具体用于以下至少之一:

识别所述字符串的props属性;

识别所述字符串的字符标识;

识别所述字符串的注释信息;

识别所述字符串的类型。

13.根据权利要求8所述的装置,其特征在于,所述填充模块,具体用于:

根据所述树节点的节点类型匹配目标描述块,其中,所述目标描述块包括以下之一:props,events,slots,methods,所述props,所述events,所述slots是所述vue组件中函数的应用编程接口api类型,所述methods是所述vue组件中方法之间的调用类型;

在所述目标描述块中填充所述树节点的节点内容。

14.根据权利要求8所述的装置,其特征在于,所述装置还包括:

上传模块,用于在所述填充模块根据所述ast生成所述vue组件的描述文档之后,在设置所述vue组件与所述描述文档的关联关系之后,将所述vue组件上传到javascript组件库。


技术总结
本发明公开了一种Vue组件的文档生成方法及装置,其中,该方法包括:获取Vue组件的源代码文件,其中,所述Vue组件是组成页面视图的抽象单元;解析所述源代码文件,生成对应的抽象语法树AST;遍历所述AST中各个树节点;根据树节点的节点类型在预设模板文档的描述块中填充所述树节点的节点内容,以生成所述Vue组件的描述文档,其中,所述描述文档用于记录所述Vue组件中各个对象的属性信息和交互关系。通过本发明,解决了相关技术中不能自动生成Vue组件的描述文档的技术问题,提高了描述文档的产出效率。

技术研发人员:霍春阳
受保护的技术使用者:北京健康之家科技有限公司
技术研发日:2019.12.23
技术公布日:2020.05.22
当前第2页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1