Web页面的开发方法、装置、设备及存储介质制造方法及图纸

技术编号:34526397 阅读:16 留言:0更新日期:2022-08-13 21:17
本申请涉及开发辅助技术领域,揭示了一种Web页面的开发方法、装置、设备及存储介质,其中方法包括:判断预设的字体图标更新脚本中的字体图标资源链接引入结果与目标字体图标资源链接是否相同;若不相同,则根据目标字体图标资源链接对字体图标资源链接引入结果进行替换;运行字体图标更新脚本,根据预设的字体图标库对页面开发工程包的字体图标文件夹进行更新;在页面开发工程包中引入字体图标文件夹中的样式文件;在页面开发工程包中,基于字体图标文件夹获取用户输入的目标Web页面代码;根据字体图标文件夹和目标Web页面代码生成目标Web页面数据包。避免了静态资源放置混乱,避免重复存放字体图标,减小项目包体积,减少冗余代码。少冗余代码。少冗余代码。

【技术实现步骤摘要】
Web页面的开发方法、装置、设备及存储介质


[0001]本申请涉及到开发辅助
,特别是涉及到一种Web页面的开发方法、装置、设备及存储介质。

技术介绍

[0002]在开发Web(全球广域网)页面时,如需要新增或修改图标,前端开发人员首先找UI(界面)设计人员切图,然后再添加到项目中以进行引用和调样式。每次引入新图标增大了项目包体积,并且需要写样式代码,增加了项目的冗余代码;不同前端开发人员增加图标、放置图标的位置不一样,很可能导致重复存放图标,增大了项目包体积,而且导致项目中静态资源放置混乱,不利于项目包的后期维护。

技术实现思路

[0003]本申请的主要目的为提供一种Web页面的开发方法、装置、设备及存储介质,旨在解决现有技术的在开发Web页面时通过添加切图到项目中以进行引用和调样式,导致增大了项目包体积、项目中静态资源放置混乱,增加了项目的冗余代码的技术问题。
[0004]为了实现上述专利技术目的,本申请提出一种Web页面的开发方法,所述方法包括:
[0005]获取页面开发请求,所述页面开发请求携带有目标字体图标资源链接;
[0006]判断预设的字体图标更新脚本中的字体图标资源链接引入结果与所述目标字体图标资源链接是否相同;
[0007]若不相同,则根据所述目标字体图标资源链接,对所述字体图标资源链接引入结果进行替换;
[0008]运行所述字体图标更新脚本,根据预设的字体图标库,对页面开发工程包的字体图标文件夹进行更新;
[0009]在所述页面开发工程包中引入所述字体图标文件夹中的样式文件;
[0010]在所述页面开发工程包中,基于所述字体图标文件夹,获取用户输入的目标Web页面代码;
[0011]根据所述字体图标文件夹和所述目标Web页面代码生成目标Web页面数据包。
[0012]进一步的,所述根据预设的字体图标库,对页面开发工程包的字体图标文件夹进行更新的步骤,包括:
[0013]判断所述页面开发工程包的资源文件夹中是否存在所述字体图标文件夹;
[0014]若不存在,则在所述资源文件夹中新建文件夹作为所述字体图标文件夹;
[0015]根据所述字体图标资源链接引入结果,从所述字体图标库中获取CSS资源内容;
[0016]对所述CSS资源内容进行依赖资源链接解析;
[0017]从所述字体图标库中获取与每个所述依赖资源链接对应的依赖资源文件;
[0018]根据所述字体图标文件夹的链接地址,对所述CSS资源内容中的远程链接进行替换,得到待存储的样式文件;
[0019]根据各个所述依赖资源文件和所述待存储的样式文件,对所述字体图标文件夹进行更新。
[0020]进一步的,所述对所述CSS资源内容进行依赖资源链接解析的步骤,包括:
[0021]将所述CSS资源内容进行字符串转换,得到待解析字符串;
[0022]对所述待解析字符串进行所述依赖资源链接解析。
[0023]进一步的,所述在所述页面开发工程包中,基于所述字体图标文件夹,获取用户输入的目标Web页面代码的步骤,包括:
[0024]在所述页面开发工程包中,采用预设的代码开发界面展示规则进行界面展示,得到代码开发界面;
[0025]根据所述代码开发界面和所述字体图标文件夹获取所述用户输入的所述目标Web页面代码。
[0026]进一步的,所述根据所述代码开发界面和所述字体图标文件夹获取所述用户输入的所述目标Web页面代码的步骤,包括:
[0027]根据所述代码开发界面获取所述用户输入的初始Web页面代码;
[0028]根据所述代码开发界面中的所述初始Web页面代码,获取所述用户输入的字体图标引入请求,其中,所述字体图标引入请求携带有待配置元素标识;
[0029]获取所述用户输入的与所述待配置元素标识对应的元素添加ClassName属性作为待配置属性;
[0030]基于所述字体图标文件夹,获取所述用户针对所述待配置属性输入的目标字体图标标识;
[0031]重复执行所述根据所述代码开发界面中的所述初始Web页面代码,获取所述用户输入的字体图标引入请求的步骤,直至获取到所述用户输入的打包信号;
[0032]响应所述打包信号,将所述代码开发界面中的所述初始Web页面代码和各个所述目标字体图标标识作为所述目标Web页面代码。
[0033]进一步的,所述将所述代码开发界面中的所述初始Web页面代码和各个所述目标字体图标标识作为所述目标Web页面代码的步骤,包括:
[0034]获取所述用户输入的样式修改请求,其中,所述样式修改请求携带有一个或多个待修改元素标识;
[0035]在所述代码开发界面中,基于所述字体图标文件夹,根据每个所述待修改元素标识对应的所述ClassName属性的所述目标字体图标标识获取所述用户输入的样式配置结果;
[0036]将所述代码开发界面中的所述初始Web页面代码、各个所述目标字体图标标识和各个所述样式配置结果作为所述目标Web页面代码。
[0037]进一步的,所述在所述页面开发工程包中,基于所述字体图标文件夹,获取用户输入的目标Web页面代码的步骤,包括:
[0038]在所述页面开发工程包中,获取代码下载请求,其中,所述代码下载请求携带有目标代码标识;
[0039]在所述页面开发工程包中,从服务端的Web页面代码库中获取与所述目标代码标识对应的Web页面代码作为待编辑Web页面代码;
[0040]在所述页面开发工程包中,对所述待编辑Web页面代码进行界面展示,得到代码开发界面;
[0041]根据所述代码开发界面和所述字体图标文件夹获取所述用户输入的所述目标Web页面代码。
[0042]本申请还提出了一种Web页面的开发装置,所述装置包括:
[0043]请求获取模块,用于获取页面开发请求,所述页面开发请求携带有目标字体图标资源链接;
[0044]判断模块,用于判断预设的字体图标更新脚本中的字体图标资源链接引入结果与所述目标字体图标资源链接是否相同;
[0045]替换模块,用于若不相同,则根据所述目标字体图标资源链接,对所述字体图标资源链接引入结果进行替换;
[0046]字体图标文件夹更新模块,用于运行所述字体图标更新脚本,根据预设的字体图标库,对页面开发工程包的字体图标文件夹进行更新;
[0047]样式文件引入模块,用于在所述页面开发工程包中引入所述字体图标文件夹中的样式文件;
[0048]目标Web页面代码获取模块,惯用语在所述页面开发工程包中,基于所述字体图标文件夹,获取用户输入的目标Web页面代码;
[0049]目标Web页面数据包生成模块,用于根据所述字体图标文件夹和所述目标Web页面代码生成目标Web页面数据包。
[0050]本申请还提出了一种计算机设备,包括存储器和处理器,所述存储器存储有计算机本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种Web页面的开发方法,其特征在于,所述方法包括:获取页面开发请求,所述页面开发请求携带有目标字体图标资源链接;判断预设的字体图标更新脚本中的字体图标资源链接引入结果与所述目标字体图标资源链接是否相同;若不相同,则根据所述目标字体图标资源链接,对所述字体图标资源链接引入结果进行替换;运行所述字体图标更新脚本,根据预设的字体图标库,对页面开发工程包的字体图标文件夹进行更新;在所述页面开发工程包中引入所述字体图标文件夹中的样式文件;在所述页面开发工程包中,基于所述字体图标文件夹,获取用户输入的目标Web页面代码;根据所述字体图标文件夹和所述目标Web页面代码生成目标Web页面数据包。2.根据权利要求1所述的Web页面的开发方法,其特征在于,所述根据预设的字体图标库,对页面开发工程包的字体图标文件夹进行更新的步骤,包括:判断所述页面开发工程包的资源文件夹中是否存在所述字体图标文件夹;若不存在,则在所述资源文件夹中新建文件夹作为所述字体图标文件夹;根据所述字体图标资源链接引入结果,从所述字体图标库中获取CSS资源内容;对所述CSS资源内容进行依赖资源链接解析;从所述字体图标库中获取与每个所述依赖资源链接对应的依赖资源文件;根据所述字体图标文件夹的链接地址,对所述CSS资源内容中的远程链接进行替换,得到待存储的样式文件;根据各个所述依赖资源文件和所述待存储的样式文件,对所述字体图标文件夹进行更新。3.根据权利要求2所述的Web页面的开发方法,其特征在于,所述对所述CSS资源内容进行依赖资源链接解析的步骤,包括:将所述CSS资源内容进行字符串转换,得到待解析字符串;对所述待解析字符串进行所述依赖资源链接解析。4.根据权利要求1所述的Web页面的开发方法,其特征在于,所述在所述页面开发工程包中,基于所述字体图标文件夹,获取用户输入的目标Web页面代码的步骤,包括:在所述页面开发工程包中,采用预设的代码开发界面展示规则进行界面展示,得到代码开发界面;根据所述代码开发界面和所述字体图标文件夹获取所述用户输入的所述目标Web页面代码。5.根据权利要求4所述的Web页面的开发方法,其特征在于,所述根据所述代码开发界面和所述字体图标文件夹获取所述用户输入的所述目标Web页面代码的步骤,包括:根据所述代码开发界面获取所述用户输入的初始Web页面代码;根据所述代码开发界面中的所述初始Web页面代码,获取所述用户输入的字体图标引入请求,其中,所述字体图标引入请求携带有待配置元素标识;获取所述用户输入的与所述待配置元素标识对应的元素添加ClassName属性作为待配
置属性;基于所述字体图标文件夹,获取所述用户针对所述待配置属性输入的目标字体图标标识;重复执行所述根据所述代码开发界面中的所述初始Web页...

【专利技术属性】
技术研发人员:叶伟
申请(专利权)人:中国平安财产保险股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1