Web页面的开发方法、装置、计算机设备和可读存储介质与流程

文档序号:22469627发布日期:2020-10-09 21:58阅读:92来源:国知局
本申请涉及计算机
技术领域
:,特别是涉及一种web页面的开发方法、装置、计算机设备和可读存储介质。
背景技术
::在当前的web页面产品开发过程中,开发工程师通常会根据产品需求进行需求拆分,并根据拆分的各个子需求进行产品开发,最后将各个子需求对应的开发结果合并为整个web页面产品。通常情况下,对于两个或多个web页面产品的开发过程,即便这些页面产品中具有相同的子需求,开发工程师仍需要对每个页面产品进行需求分析,并单独开发各web页面产品。可以看出,传统技术中的web页面开发过程,其开发成本较高。技术实现要素:基于此,有必要针对传统技术中web页面的开发成本较高的问题,提供一种web页面的开发方法、装置、计算机设备和可读存储介质。一种web页面的开发方法,该方法包括:获取用户基于页面需求选择的目标页面组件以及目标页面组件对应的工程脚本;其中,页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应;获取针对目标页面组件输入的前端配置,并基于输入的前端配置生成组件配置数据;根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本;该合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。在其中一个实施例中,获取用户基于页面需求选择的目标页面组件,包括:接收用户基于页面需求输入的组件展示指令,并响应于组件展示指令,展示组件集合界面;该组件集合界面包括多个页面候选组件;接收用户在组件集合界面上输入的页面组件选择指令,响应于页面组件选择指令,展示目标组件界面;其中,目标组件界面包括目标页面组件。在其中一个实施例中,目标组件界面包括组件配置控件;获取针对目标页面组件输入的前端配置,包括:接收用户对组件配置控件的第一触发操作,并响应于第一触发操作,展示前端配置界面,该前端配置界面包括目标页面组件的显示参数配置项;接收用户在前端配置界面输入的配置指令,该配置指令中携带显示参数配置项的配置数据;响应于配置指令,获取前端配置。在其中一个实施例中,配置数据包括目标页面组件的展示内容、展示方式和展示效果中的至少一个。在其中一个实施例中,目标组件界面包括生成控件;基于输入的前端配置生成组件配置数据,包括:接收用户对生成控件的第二触发操作,响应于述第二触发操作,基于前端配置生成组件配置数据;其中,组件配置数据的格式为json格式。在其中一个实施例中,获取目标页面组件对应的工程脚本,包括:获取页面组件源代码;页面组件源代码包括目标页面组件对应的代码和未选择的页面组件对应的代码;根据目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在其中一个实施例中,目标组件界面上包括合并控件;从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本,包括:接收针对合并控件的第三触发操作,展示合并界面;该合并界面包括剔除选项;根据用户对剔除选项的选择指令,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在其中一个实施例中,合并界面上包括合并方式选项;根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本,包括:根据用户针对合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本。在其中一个实施例中,目标页面组件存储于项目组件库中;上方法还包括:采集第三方组件库中页面参考组件的被调用次数;若页面参考组件的被调用次数大于预设阈值,接收用户输入的组件新增指令,并响应于组件新增指令,将页面参考组件加入项目组件库中。在其中一个实施例中,在获取用户基于页面需求选择的目标页面组件之前,上述方法还包括:获取用户基于页面需求创建的页面项目,页面项目包括项目标识、项目名称、创建者和创建时间;相应的,获取用户基于页面需求选择的目标页面组件,包括:获取用户针对页面项目选择的目标页面组件。一种web页面的开发装置,该装置包括:获取模块,用于获取用户基于页面需求选择的目标页面组件以及目标页面组件对应的工程脚本;其中,页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应;前端配置模块,用于获取针对目标页面组件输入的前端配置,并基于输入的前端配置生成组件配置数据;合并脚本生成模块,用于根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本;该合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。一种计算机设备,包括存储器和处理器,存储器存储有计算机程序,处理器执行该计算机程序时实现上述web页面的开发方法的步骤。一种计算机可读存储介质,其上存储有计算机程序,该计算机程序被处理器执行时实现上述web页面的开发方法的步骤。上述web页面的开发方法、装置、计算机设备和可读存储介质,能够首先获取用户基于页面需求选择的目标页面组件以及该目标页面组件对应的工程脚本,其中,页面需求包括第一功能需求和第二功能需求,该目标页面组件所实现的功能与第一功能需求对应;然后获取针对目标页面组件输入的前端配置,并基于该前端配置生成组件配置数据;最后,根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本,该合并脚本用于响应用户针对上述第二功能需求输入的线下开发操作以生成web页面。也即是说,将固化的一些页面需求抽象为组件形式供用户直接选择,目标页面组件所实现的功能无需用户再次进行开发,减少了开发成本;并且用户可直接在前端选择针对目标页面组件的配置数据,也无需进行线下开发,且可以针对不同的页面需求选择个性化的配置数据,提高了web页面开发过程的选择针对性,即用户只需针对没有固化为组件的功能需求进行线下开发即可。因此,本实施例中web页面的开发方法,可大大减少开发成本。附图说明图1为一个实施例中计算机设备的内部结构图;图2为一个实施例中web页面的开发方法的流程示意图;图2a为一个实施例中专题系统的界面示意图;图3为另一个实施例中web页面的开发方法的流程示意图;图3a为一个实施例中输入组件展示指令的界面示意图;图3b为一个实施例中组件集合展示界面的示意图;图3c为一个实施例中目标组件界面的示意图;图4为又一个实施例中web页面的开发方法的流程示意图;图4a为一个实施例中前端配置界面的示意图;图5为又一个实施例中web页面的开发方法的流程示意图;图5a为一个实施例中已配置好的目标组件界面的示意图;图5b为一个实施例中合并界面的示意图;图5c为一个实施例中第三方组件库的展示界面示意图;图6为又一个实施例中web页面的开发方法的流程示意图;图7为一个实施例中web页面的开发装置的结构框图。具体实施方式为了使本申请的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本申请进行进一步详细说明。应当理解,此处描述的具体实施例仅仅用以解释本申请,并不用于限定本申请。本申请实施例提供的web页面的开发方法,可以适用于如图1所示的计算机设备。该计算机设备包括通过系统总线连接的处理器、存储器,该存储器中存储有计算机程序,处理器执行该计算机程序时可以执行下述方法实施例的步骤。可选地,该计算机设备还可以包括通信接口、显示屏和输入装置。其中,该计算机设备的通信接口用于与外部的终端通过网络连接通信,显示屏用于向用户显示各种数据页面,输入装置用于用户输入各种操作指令。可选地,该计算机设备可以是个人计算机(personalcomputer,简称pc),还可以是个人数字助理,还可以是其他的终端设备,例如平板电脑(portableandroiddevice,简称pad)、手机等等,还可以是云端或者远程服务器,本申请实施例对计算机设备的具体形式并不做限定。在一个实施例中,如图2所示,提供了一种web页面的开发方法,以该方法应用于图1中的计算机设备为例进行说明,本实施例涉及的是计算机设备基于用户选择的目标页面组件进行配置,并生成合并脚本的具体过程,该方法包括以下步骤:s101,获取用户基于页面需求选择的目标页面组件以及目标页面组件对应的工程脚本;其中,页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应。其中,当需要开发一个web页面产品时,该页面产品通常会对应有页面需求,即其需要实现什么功能、各功能之间具有什么联系等;例如当前需要开发一个转盘抽奖页面,其对应的页面需求可以包括转盘中展示哪些奖品、各奖品的展示图片、图片色彩度等等。本实施例中,为减少重复开发成本,开发工程师将一些固化的页面需求抽象成页面组件,并以专题系统的形式提供给用户(产品或者运营人员)使用,那么用户可以根据收到的页面需求从专题系统中选择目标页面组件。该专题系统可以为供用户进行线上选择目标页面组件的前端系统,其展示界面可以如图2a所示。其中,上述页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应。示例性的,假设上述页面需求中包括a、b、c三个功能需求,专题系统中的页面组件可以实现a和b两个功能需求,那么用户便可以在专题系统中选择a和b两个功能需求所对应的目标页面组件。另外,页面组件通常还会对应有工程脚本,即实现该页面组件的工程代码。计算机设备获取到用户选择的目标页面组件后,可以根据目标页面组件的标识从代码库中选择到目标页面组件对应的工程脚本。s102,获取针对目标页面组件输入的前端配置,并基于输入的前端配置生成组件配置数据。具体地,计算机设备获取上述用户选择的目标页面组件,相当于获取的是web页面可实现的功能框架,那么随后便要对这些目标页面组件进行配置,达到其可实现的具体功能。计算机设备可以获取用户针对目标页面组件输入的前端配置,该前端配置可以由用户通过上述专题系统进行输入,如某一目标页面组件对应的是背景图片展示功能,则用户可以通过专题系统配置背景图片以及背景图片的色彩度等数据。然后计算机设备可以基于输入的前端配置生成组件配置数据。可选地,计算机设备可以将用户输入的前端配置内容进行存储,当用户将所有前端配置都完成后,基于输入的前端配置生成组件配置数据。s103,根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本;合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。具体地,计算机设备得到上述目标页面组件对应的工程脚本和组件配置数据后,可以根据两者生成目标页面组件对应的合并脚本,即将组件配置数据“填充”至工程脚本中,使得目标页面组件实现了上述第一功能需求。可选地,计算机设备可以将组件配置数据植入在专题系统入口文件,当专题系统执行目标页面组件的工程脚本时,便可获取对应的组件配置数据。其中,因上述页面需求包括第一功能需求和第二功能需求,而目标页面组件仅能实现第一功能需求,因此,第二功能需求可由用户进行线下开发。那么,得到的合并脚本可以响应用户针对第二功能需求输入发线下开发操作,以生成web页面。可选地,上述合并脚本可以以压缩包zip的形式提供,此时用户可以将zip包下载到本地后进行二次开发,则用户只需对专题系统不支持的功能需求进行开发即可,无需再进行全部的开发过程。本实施例提供的web页面的开发方法,计算机设备首先获取用户基于页面需求选择的目标页面组件以及该目标页面组件对应的工程脚本,其中,页面需求包括第一功能需求和第二功能需求,该目标页面组件所实现的功能与第一功能需求对应;然后获取针对目标页面组件输入的前端配置,并基于该前端配置生成组件配置数据;最后,根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本,该合并脚本用于响应用户针对上述第二功能需求输入的线下开发操作以生成web页面。也即是说,将固化的一些页面需求抽象为组件形式供用户直接选择,目标页面组件所实现的功能无需用户再次进行开发,减少了开发成本;并且用户可直接在前端选择针对目标页面组件的配置数据,也无需进行线下开发,且可以针对不同的页面需求选择个性化的配置数据,提高了web页面开发过程的选择针对性,即用户只需针对没有固化为组件的功能需求进行线下开发即可。因此,本实施例中web页面的开发方法,可大大减少开发成本。由上述描述可知,用户可通过专题系统选择目标页面组件,可选地,该专题系统可以通过网页向用户展示组件集合界面,则用户可在该组件集合界面上选择目标页面组件。可选地,如图3所示,上述s101可以包括:s201,接收用户基于页面需求输入的组件展示指令,并响应于组件展示指令,展示组件集合界面;该组件集合界面包括多个页面候选组件。具体地,当用户需要选择目标页面组件时,计算机设备可以先将全部的组件集合展示出来。那么,计算机设备可以接收用户基于页面需求输入的组件展示指令,并响应该组件展示指令,以展示组件集合界面。示例性的,如图3a所示,当前界面为用户输入组件展示指令的界面,当用户点击其中的“+”控件,即表征输入了组件展示指令,并由当前界面跳转至如图3b所示的界面,该界面为组件集合展示界面,包括了多个页面候选组件(如图3b中的“节目订阅”、“直播预告”、“报名组件”等都为页面候选组件),用户便可以后续根据从这多个页面候选组件中选择需要的目标页面组件。可选地,用户还可以以语音形式、或滑动“+”控件等方式输入组件展示指令,本实施例对组件展示指令的输入方式不做限制。s202,接收用户在组件集合界面上输入的页面组件选择指令,响应于页面组件选择指令,展示目标组件界面;其中,目标组件界面包括目标页面组件。具体地,在如图3b所示的组件集合界面上,针对可实现第一功能需求的目标页面组件,用户可以输入页面组件选择指令,例如鼠标左键的点击操作。计算机设备响应于该页面组件选择指令,选择完成后便可展示目标组件界面,该目标组件界面可以为如图3c所示的界面;其中,该目标组件界面上的id:1-id:6即为所选择的目标页面组件。可选地,用户还可以通过语音形式(如输入“选择节目订阅组件”语音)、或在页面候选组件上进行滑动等方式输入页面组件选择指令。本实施例提供的web页面的开发方法,计算机设备可以接收用户基于页面需求输入的组件展示指令,并响应于该组件展示指令以展示组件集合界面;然后接收用户在组件集合界面上输入的页面组件选择指令,并响应于该页面组件选择指令以展示目标组件界面,即完成了目标页面组件的选择过程。本实施例中,目标页面组件的选择均为通过在界面上选取所得到的,极大简便了用户的选择过程,进而减少了开发成本。继续参见上述图3c所示的目标组件界面,当选择完目标页面组件时,该界面只展示了已选择的页面组件,那么接下来就需要对各目标页面组件进行前端配置。可选地,该目标组件界面上可以包括组件配置控件,例如可以是图3c中的“设置”按钮,如图4所示,上述s102可以包括:s301,接收用户对组件配置控件的第一触发操作,并响应于第一触发操作,展示前端配置界面,该前端配置界面包括目标页面组件的显示参数配置项。具体地,用户可以通过点击“设置”按钮输入对组件配置控件的第一触发操作,计算机设备便可以响应于该第一触发操作,以显示前端配置界面,该前端配置界面可以参见图4a所示,由图中可以看出,所展示的前端配置界面上包括了目标页面组件的显示参数配置项,如抽奖背景图片选用哪个图片、选用哪个奖品图片以及奖品图片的各类色彩等。可选地,用户还可以通过输入“设置”语音、或预设的滑动操作等方式输入第一触发操作。s302,接收用户在前端配置界面输入的配置指令,配置指令中携带显示参数配置项的配置数据。s303,响应于配置指令,获取前端配置。具体地,在图4a所示的前端配置界面上,用户可以输入各项的配置指令,该配置指令中携带显示参数配置项的配置数据。例如,上传在pc端或者h5端的图片,奖品图片边框色彩选用黄色、奖品名称底色选用紫色等等(其中黄色、紫色即为配置数据)。由此,计算机设备响应于配置指令后,便可获取到用户输入的前端配置。可选地,上述配置数据可以包括目标页面组件的展示内容、展示方式和展示效果中的至少一个。在图3c所示的目标组件界面上还可以包括生成控件,例如该生成控件可以是“保存全部”按钮,则计算机设备可以接收用户针对该生成控件的第二触发操作(如点击操作、滑动操作或语音输入等方式),响应于该第二触发操作,便可以基于前端配置生成组件配置数据,即计算机设备接收到用户对生成控件的触发操作后才可生成组件配置数据,以减少组件配置数据的冗余性。可选地,该组件配置数据的格式可以为json格式,当然也可以为其他的数据格式。本实施例提供的web页面的开发方法,计算机设备可以接收用户对组件配置控件的第一触发操作,并响应于第一触发操作以展示前端配置界面;然后接收用户在前端配置界面输入的配置指令,响应于该配置指令获取前端配置;再接收用户对前端配置界面上生成控件的第二触发操作,响应于该第二触发操作以基于前端配置生成组件配置数据。本实施例中,对目标页面组件的配置过程同样均为通过在界面上选取所得到的,极大简便了用户的选择过程,进而减少了开发成本。在一个实施例中,还提供了获取目标页面组件对应的工程脚本的具体过程。可选地,如图5所示,上述s101可以包括:s401,获取页面组件源代码;页面组件源代码包括目标页面组件对应的代码和未选择的页面组件对应的代码。s402,根据目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。其中,页面组件源代码可以存储于代码库中,代码库可以存储于远端服务器中(如gitlab平台),则计算机设备可以通过与远端服务器的通信过程,获取页面组件源代码。然后根据选择的目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,可选地,可以根据目标页面组件的标识,剔除未选择的页面组件对应的代码,得到上述工程脚本。可选地,为了保持各页面组件的独立性,会将每个组件以独立文件或模块的形式存在,方便组件渲染复用或剔除。可选地,针对已配置好的目标组件界面可以参见图5a所示,该目标组件界面上可以包括合并控件,例如可以是图5a中的“发布”按钮,计算机设备可以接收用户针对该合并控件的第三触发操作(如点击操作、滑动操作或语音输入等方式),展示合并界面,该合并界面可以参见图5b所示的示意图,其中包括剔除选项。若用户选择了“是否剔除未勾选组件”中的“是”按钮,即输入了针对剔除选项的选择指令,计算机设备便可以根据该选择指令,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。可选地,上述合并界面上还可以包括合并方式选项,例如可以是图5b中的“直接植入”、“异步加载”选项,则计算机设备可以根据用户针对合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本。例如,通过直接植入的方式将工程脚本和组件配置数据进行合并、或者通过异步加载的方式将工程脚本和组件配置数据进行合并。本实施例提供的web页面的开发方法,计算机设备可以直接根据选择的目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,得到目标页面组件对应的工程脚本,并根据用户针对合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本。由此,无需再由用户对页面需求中的每个子需求进行单独开发,直接选择合并即可,从而大大较少了开发成本。在一个实施例中,上述目标页面组件可以存储于项目组件库中,此项目组件库中的页面组件可由所有用户进行选择;除此之外,用户还可以在自己的权限下建立一些私有页面组件,仅供自己选择,并存储于第三方组件库中。当第三方组件库中的页面组件被调用次数达到一定数量时,计算机设备可以将这些页面组件添加至项目组件库中,以供其他用户选择。可选地,上述方法还可以包括:采集第三方组件库中页面参考组件的被调用次数;若页面参考组件的被调用次数大于预设阈值,接收用户输入的组件新增指令,并响应于组件新增指令,将页面参考组件加入项目组件库中。关于第三方组件库的展示界面可以参见图5c所示。具体地,计算机设备可以以固定的时间间隔,采集第三方组件库中页面参考组件的被调用次数,若被调用次数大于预设阈值(如20次),则接收用户输入的组件新增指令,将该页面参考组件加入项目组件库中。由此,可不断扩大项目组件库中的组件数量,使后续的用户选择范围更加广泛,减少对固化的页面需求的开发成本。在一个实施例中,在上述获取用户基于页面需求选择的目标页面组件之前,上述方法还可以包括:获取用户基于页面需求创建的页面项目,该页面项目包括项目标识、项目名称、创建者和创建时间;获取用户针对页面项目选择的目标页面组件。即用户可以先创建一个页面项目,然后基于该页面项目选择对应的目标页面组件,所创建的页面项目示意图可以参见上述图2a所示,用户可以通过触发该页面项目上的“编辑”控件,跳转至图3a的组件展示指令输入界面,以选择目标页面组件。为更好理解整个web页面的开发方法的过程,下面以一个整体实施例方式对该方法进行介绍。如图6所示,该方法可以包括:s501,接收用户基于页面需求输入的组件展示指令,并响应于组件展示指令,展示组件集合界面;s502,接收用户在组件集合界面上输入的页面组件选择指令,响应于页面组件选择指令,展示目标组件界面;目标组件界面包括目标页面组件;s503,接收用户对目标组件界面上组件配置控件的第一触发操作,并响应于第一触发操作,展示前端配置界面;s504,接收用户在前端配置界面输入的配置指令,响应于配置指令,获取前端配置;s505,接收用户对目标组件界面上生成控件的第二触发操作,响应于第二触发操作,基于前端配置生成组件配置数据;s506,接收针对目标组件界面上合并控件的第三触发操作,展示合并界面;合并界面包括剔除选项;s507,根据用户对剔除选项的选择指令,从页面组件源代码中剔除未选择的页面组件对应的代码,得到目标页面组件对应的工程脚本;s508,根据用户针对合并界面上合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本,合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。上述各步骤的实现过程可以参见上述实施例的描述,其实现原理和技术效果类似,在此不再赘述。应该理解的是,虽然图2-图6的流程图中各个步骤按照箭头的指示依次显示,但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明,这些步骤的执行并没有严格的顺序限制,这些步骤可以以其它的顺序执行。而且,图2-图6中的至少一部分步骤可以包括多个子步骤或者多个阶段,这些子步骤或者阶段并不必然是在同一时刻执行完成,而是可以在不同的时刻执行,这些子步骤或者阶段的执行顺序也不必然是依次进行,而是可以与其它步骤或者其它步骤的子步骤或者阶段的至少一部分轮流或者交替地执行。在一个实施例中,如图7所示,提供了一种web页面的开发装置,包括:获取模块11、前端配置模块12和合并脚本生成模块13。具体地,获取模块11,用于获取用户基于页面需求选择的目标页面组件以及目标页面组件对应的工程脚本;其中,页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应;前端配置模块12,用于获取针对目标页面组件输入的前端配置,并基于输入的前端配置生成组件配置数据;合并脚本生成模块13,用于根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本;该合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。本实施例提供的web页面的开发装置,可以执行上述方法实施例,其实现原理和技术效果类似,在此不再赘述。在一个实施例中,上述获取模块11,具体用于接收用户基于页面需求输入的组件展示指令,并响应于组件展示指令,展示组件集合界面;该组件集合界面包括多个页面候选组件;接收用户在组件集合界面上输入的页面组件选择指令,响应于页面组件选择指令,展示目标组件界面;其中,目标组件界面包括目标页面组件。在一个实施例中,目标组件界面包括组件配置控件;前端配置模块12,具体用于接收用户对组件配置控件的第一触发操作,并响应于第一触发操作,展示前端配置界面,该前端配置界面包括目标页面组件的显示参数配置项;接收用户在前端配置界面输入的配置指令,该配置指令中携带显示参数配置项的配置数据;响应于配置指令,获取前端配置。在一个实施例中,配置数据包括目标页面组件的展示内容、展示方式和展示效果中的至少一个。在一个实施例中,目标组件界面包括生成控件;前端配置模块12,具体用于接收用户对生成控件的第二触发操作,响应于述第二触发操作,基于前端配置生成组件配置数据;其中,组件配置数据的格式为json格式。在一个实施例中,获取模块11,具体用于获取页面组件源代码;页面组件源代码包括目标页面组件对应的代码和未选择的页面组件对应的代码;根据目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在一个实施例中,目标组件界面上包括合并控件;获取模块11,具体用于接收针对合并控件的第三触发操作,展示合并界面;该合并界面包括剔除选项;根据用户对剔除选项的选择指令,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在一个实施例中,合并界面上包括合并方式选项;合并脚本生成模块13,具体用于根据用户针对合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本。在一个实施例中,目标页面组件存储于项目组件库中;上述装置还包括采集模块,用于采集第三方组件库中页面参考组件的被调用次数;若页面参考组件的被调用次数大于预设阈值,接收用户输入的组件新增指令,并响应于组件新增指令,将页面参考组件加入项目组件库中。在一个实施例中,上述获取模块11,还用于获取用户基于页面需求创建的页面项目,页面项目包括项目标识、项目名称、创建者和创建时间;并获取用户针对页面项目选择的目标页面组件。本实施例提供的web页面的开发装置,可以执行上述方法实施例,其实现原理和技术效果类似,在此不再赘述。关于web页面的开发装置的具体限定可以参见上文中对于web页面的开发方法的限定,在此不再赘述。上述web页面的开发装置中的各个模块可全部或部分通过软件、硬件及其组合来实现。上述各模块可以硬件形式内嵌于或独立于计算机设备中的处理器中,也可以以软件形式存储于计算机设备中的存储器中,以便于处理器调用执行以上各个模块对应的操作。在一个实施例中,提供了一种计算机设备,该计算机设备可以是终端,其内部结构图可以如图1所示。该计算机设备包括通过系统总线连接的处理器、存储器、通信接口、显示屏和输入装置。其中,该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统和计算机程序。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的通信接口用于与外部的终端进行有线或无线方式的通信,无线方式可通过wifi、运营商网络、nfc(近场通信)或其他技术实现。该计算机程序被处理器执行时以实现一种web页面的开发方法。该计算机设备的显示屏可以是液晶显示屏或者电子墨水显示屏,该计算机设备的输入装置可以是显示屏上覆盖的触摸层,也可以是计算机设备外壳上设置的按键、轨迹球或触控板,还可以是外接的键盘、触控板或鼠标等。本领域技术人员可以理解,图1中示出的结构,仅仅是与本申请方案相关的部分结构的框图,并不构成对本申请方案所应用于其上的计算机设备的限定,具体的计算机设备可以包括比图中所示更多或更少的部件,或者组合某些部件,或者具有不同的部件布置。在一个实施例中,提供了一种计算机设备,包括存储器和处理器,存储器中存储有计算机程序,该处理器执行计算机程序时实现以下步骤:获取用户基于页面需求选择的目标页面组件以及目标页面组件对应的工程脚本;其中,页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应;获取针对目标页面组件输入的前端配置,并基于输入的前端配置生成组件配置数据;根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本;该合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。本实施例提供的计算机设备,其实现原理和技术效果与上述方法实施例类似,在此不再赘述。在一个实施例中,处理器执行计算机程序时还实现以下步骤:接收用户基于页面需求输入的组件展示指令,并响应于组件展示指令,展示组件集合界面;该组件集合界面包括多个页面候选组件;接收用户在组件集合界面上输入的页面组件选择指令,响应于页面组件选择指令,展示目标组件界面;其中,目标组件界面包括目标页面组件。在一个实施例中,目标组件界面包括组件配置控件;处理器执行计算机程序时还实现以下步骤:接收用户对组件配置控件的第一触发操作,并响应于第一触发操作,展示前端配置界面,该前端配置界面包括目标页面组件的显示参数配置项;接收用户在前端配置界面输入的配置指令,该配置指令中携带显示参数配置项的配置数据;响应于配置指令,获取前端配置。在一个实施例中,配置数据包括目标页面组件的展示内容、展示方式和展示效果中的至少一个。在一个实施例中,目标组件界面包括生成控件;处理器执行计算机程序时还实现以下步骤:接收用户对生成控件的第二触发操作,响应于述第二触发操作,基于前端配置生成组件配置数据;其中,组件配置数据的格式为json格式。在一个实施例中,处理器执行计算机程序时还实现以下步骤:获取页面组件源代码;页面组件源代码包括目标页面组件对应的代码和未选择的页面组件对应的代码;根据目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在一个实施例中,目标组件界面上包括合并控件;处理器执行计算机程序时还实现以下步骤:接收针对合并控件的第三触发操作,展示合并界面;该合并界面包括剔除选项;根据用户对剔除选项的选择指令,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在一个实施例中,合并界面上包括合并方式选项;处理器执行计算机程序时还实现以下步骤:根据用户针对合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本。在一个实施例中,目标页面组件存储于项目组件库中;处理器执行计算机程序时还实现以下步骤:采集第三方组件库中页面参考组件的被调用次数;若页面参考组件的被调用次数大于预设阈值,接收用户输入的组件新增指令,并响应于组件新增指令,将页面参考组件加入项目组件库中。在一个实施例中,处理器执行计算机程序时还实现以下步骤:获取用户基于页面需求创建的页面项目,页面项目包括项目标识、项目名称、创建者和创建时间;获取用户针对页面项目选择的目标页面组件。在一个实施例中,提供了一种计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现以下步骤:获取用户基于页面需求选择的目标页面组件以及目标页面组件对应的工程脚本;其中,页面需求包括第一功能需求和第二功能需求,目标页面组件所实现的功能与第一功能需求对应;获取针对目标页面组件输入的前端配置,并基于输入的前端配置生成组件配置数据;根据工程脚本和组件配置数据,生成目标页面组件对应的合并脚本;该合并脚本用于响应用户针对第二功能需求输入的线下开发操作以生成web页面。本实施例提供的计算机可读存储介质,其实现原理和技术效果与上述方法实施例类似,在此不再赘述。在一个实施例中,计算机程序被处理器执行时还实现以下步骤:接收用户基于页面需求输入的组件展示指令,并响应于组件展示指令,展示组件集合界面;该组件集合界面包括多个页面候选组件;接收用户在组件集合界面上输入的页面组件选择指令,响应于页面组件选择指令,展示目标组件界面;其中,目标组件界面包括目标页面组件。在一个实施例中,目标组件界面包括组件配置控件;计算机程序被处理器执行时还实现以下步骤:接收用户对组件配置控件的第一触发操作,并响应于第一触发操作,展示前端配置界面,该前端配置界面包括目标页面组件的显示参数配置项;接收用户在前端配置界面输入的配置指令,该配置指令中携带显示参数配置项的配置数据;响应于配置指令,获取前端配置。在一个实施例中,配置数据包括目标页面组件的展示内容、展示方式和展示效果中的至少一个。在一个实施例中,目标组件界面包括生成控件;计算机程序被处理器执行时还实现以下步骤:接收用户对生成控件的第二触发操作,响应于述第二触发操作,基于前端配置生成组件配置数据;其中,组件配置数据的格式为json格式。在一个实施例中,计算机程序被处理器执行时还实现以下步骤:获取页面组件源代码;页面组件源代码包括目标页面组件对应的代码和未选择的页面组件对应的代码;根据目标页面组件,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在一个实施例中,目标组件界面上包括合并控件;计算机程序被处理器执行时还实现以下步骤:接收针对合并控件的第三触发操作,展示合并界面;该合并界面包括剔除选项;根据用户对剔除选项的选择指令,从页面组件源代码中剔除未选择的页面组件对应的代码,得到工程脚本。在一个实施例中,合并界面上包括合并方式选项;计算机程序被处理器执行时还实现以下步骤:根据用户针对合并方式选项所选择的合并方式,将工程脚本和组件配置数据生成合并脚本。在一个实施例中,目标页面组件存储于项目组件库中;计算机程序被处理器执行时还实现以下步骤:采集第三方组件库中页面参考组件的被调用次数;若页面参考组件的被调用次数大于预设阈值,接收用户输入的组件新增指令,并响应于组件新增指令,将页面参考组件加入项目组件库中。在一个实施例中,计算机程序被处理器执行时还实现以下步骤:获取用户基于页面需求创建的页面项目,页面项目包括项目标识、项目名称、创建者和创建时间;获取用户针对页面项目选择的目标页面组件。本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的计算机程序可存储于一非易失性计算机可读取存储介质中,该计算机程序在执行时,可包括如上述各方法的实施例的流程。其中,本申请所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何引用,均可包括非易失性和易失性存储器中的至少一种。非易失性存储器可包括只读存储器(read-onlymemory,rom)、磁带、软盘、闪存或光存储器等。易失性存储器可包括随机存取存储器(randomaccessmemory,ram)或外部高速缓冲存储器。作为说明而非局限,ram可以是多种形式,比如静态随机存取存储器(staticrandomaccessmemory,sram)或动态随机存取存储器(dynamicrandomaccessmemory,dram)等。以上实施例的各技术特征可以进行任意的组合,为使描述简洁,未对上述实施例中的各个技术特征所有可能的组合都进行描述,然而,只要这些技术特征的组合不存在矛盾,都应当认为是本说明书记载的范围。以上所述实施例仅表达了本申请的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对发明专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本申请构思的前提下,还可以做出若干变形和改进,这些都属于本申请的保护范围。因此,本申请专利的保护范围应以所附权利要求为准。当前第1页12当前第1页12
当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1