[发明专利]前端代码生成方法、装置、系统及存储介质

说明书

本公开提供了一种前端代码生成方法、装置、系统及存储介质，应用于金融领域的计算机技术，包括：获取当前时刻图形用户界面的视觉稿，该当前时刻的前一时刻的图形用户界面的视觉稿，以及该前一时刻的图形用户界面的视觉稿对应的领域特定语言DSL代码，基于长短期记忆网络，将该前一时刻图形用户界面的视觉稿和该前一时刻图形用户界面的视觉稿对应的DSL代码作为输入，该当前时刻的图形用户界面的视觉稿作为目标标注建立DSL代码预测模型，将该当前时刻图形用户界面的视觉稿输入该DSL代码预测模型，得到该当前时刻图形用户界面对应的DSL代码，根据该DSL代码，生成该当前时刻图形用户界面对应的前端代码，实现前端代码的自动化生成。

技术领域

本公开涉及金融领域的计算机技术，更具体地，涉及一种前端代码生成方法、装置、系统及存储介质。

背景技术

在现有的前端开发过程中，前端开发工程师需要将设计师给出的UI转化为相应的前端代码。由于用户界面十分复杂，前端开发工程师不仅要编写UI界面，还要编写对应的交互逻辑，这就使得对应的前端代码量巨大。并且编写UI界面的工作中有着大量重复的标签元素，导致前端开发工作繁琐且工作重复性很大。此外，定制化开发网站、移动端APP界面的计算机语言也不尽相同，从而导致在开发针对多个平台的软件时存在繁琐而重复的工作。

发明内容

有鉴于此，本公开提供了一种前端代码生成方法、装置、系统及存储介质。

本公开的一个方面提供了一种前端代码生成方法，包括：

获取当前时刻图形用户界面的视觉稿，所述当前时刻的前一时刻的图形用户界面的视觉稿，以及所述前一时刻的图形用户界面的视觉稿对应的领域特定语言DSL代码；

基于长短期记忆网络，将所述前一时刻图形用户界面的视觉稿和所述前一时刻图形用户界面的视觉稿对应的DSL代码作为输入，所述当前时刻的图形用户界面的视觉稿作为目标标注建立DSL代码预测模型，所述DSL代码预测模型用于预测所述当前时刻的图形用户界面对应的DSL代码；

将所述当前时刻图形用户界面的视觉稿输入所述DSL代码预测模型，得到所述当前时刻图形用户界面对应的DSL代码；

根据所述DSL代码，生成所述当前时刻图形用户界面对应的前端代码。

在本公开实施例，提取所述前一时刻的图形用户界面的视觉稿中的图形用户界面元素；

识别所述图形用户界面元素类型；

确定所述图形用户界面元素类型对应的DSL代码的代码特征；

根据所述DSL代码的代码特征，生成所述前一时刻的图形用户界面的视觉稿对应的DSL代码。

在本公开实施例，所述提取所述前一时刻的图形用户界面的视觉稿中的图形用户界面元素包括：

通过卷积神经网络提取所述视觉稿中的图像特征，得到固定维度的特征向量。

在本公开实施例，所述识别所述图形用户界面元素类型包括：

将所述特征向量输入预设的分类器，输出所述视觉稿所属的分类；

标示出所述视觉稿中所包含的物体的位置和所述物体所属的种类。

在本公开实施例，所述确定所述图形用户界面元素类型对应的DSL代码的代码特征包括：

获取所述图形用户界面元素类型与DSL代码的代码特征的对应关系；

根据所述对应关系确定所述图形用户界面元素类型对应的DSL代码的代码特征。

在本公开实施例，当训练所述DSL代码预测模型时，采用48步展开所述长短期记忆网络。

本公开的另一个方面提供了一种前端代码生成装置，包括：