一种React组件自动生成方法、装置、设备及介质与流程

本发明涉及web前端开发，尤其涉及一种react组件自动生成方法、装置、设备及介质。

背景技术：

1、在现代web开发中，使用svg图标和react组件已经成为主流。svg图标由于其矢量特性，可以在不同的分辨率下保持高质量显示，而react组件则因其组件化和复用性受到开发者的青睐。

2、然而，传统方式中，开发者需要手动将每个svg文件转换为react组件并进行管理，通常是一个耗时且容易出错的过程。同时，手动管理和维护大量的图标文件和组件库，容易导致版本不一致和质量问题。此外，在svg转换为react组件的过程中通常缺乏统一的组件库接口，导致集成和使用复杂。

技术实现思路

1、基于此，本发明提供了一种react组件自动生成方法、装置、设备及介质，以解决svg文件转换react组件时不智能不高效的问题。

2、第一方面，本发明实施例提供了一种react组件自动生成方法，该方法包括：

3、采集目标用户上传到文件存储系统中的图标文件，并将采集到的图标文件存入第一存储器中；其中，图标文件的文件格式包括非svg格式或svg格式；

4、将第一存储器中存储的各文件格式的图标文件，统一转换为svg格式文件后，执行将各svg格式文件转换为react组件格式文件的操作，并将成功转换得到的react组件格式文件存入第二存储器中；

5、将第二存储器中存储的各react组件格式文件组建得到react图标组件库进行发布，以供以所述目标用户访问和使用该react图标组件库。

6、第二方面，本发明实施例还提供了一种react组件自动生成装置，该装置包括：

7、图标文件采集模块，用于采集目标用户上传到文件存储系统中的图标文件，并将采集到的图标文件存入第一存储器中；其中，图标文件的文件格式包括非svg格式或svg格式；

8、格式转换模块，用于将第一存储器中存储的各文件格式的图标文件，统一转换为svg格式文件后，执行将各svg格式文件转换为react组件格式文件的操作，并将成功转换得到的react组件格式文件存入第二存储器中；

9、组件库发布模块，用于将第二存储器中存储的各react组件格式文件组建得到react图标组件库进行发布，以供以所述目标用户访问和使用该react图标组件库。

10、第三方面，本发明实施例还提供了一种电子设备，所述电子设备包括：

11、至少一个处理器；以及

12、与所述至少一个处理器通信连接的存储器；其中，

13、所述存储器存储有可被所述至少一个处理器执行的计算机程序，所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行本发明任一实施例所述的一种react组件自动生成方法。

14、根据本发明的另一方面，提供了一种计算机可读存储介质，所述计算机可读存储介质存储有计算机指令，所述计算机指令用于使处理器执行时实现本发明任一实施例所述的一种react组件自动生成方法。

15、本发明实施例的技术方案，支持将用户上传的多种格式下的图标文件转换为svg格式文件，同时通过建立第一存储器以及第二存储器将转换成功的react组件格式文件筛选出来，并基于第二存储器中的数据构建了react图标组件库，最终实现了用户在其项目中成功使用自动化生成的专属图表组件，整个过程针对每个目标用户做到了自定义组件生成的同时，提高了开发效率，保证了用户使用的及时性与一致性，提升用户使用感受。

16、应当理解，本部分所描述的内容并非旨在标识本发明的实施例的关键或重要特征，也不用于限制本发明的范围。本发明的其它特征将通过以下的说明书而变得容易理解。

技术特征：

1.一种react组件自动生成方法，其特征在于，包括：

2.根据权利要求1所述的方法，其特征在于，将第一存储器中存储的各文件格式的图标文件，统一转换为svg格式文件，包括：

3.根据权利要求2所述的方法，其特征在于，将当前处理的目标图标文件转换为svg格式文件，包括：

4.根据权利要求1所述的方法，其特征在于，执行将各svg格式文件转换为react组件格式文件的操作，并将成功转换得到的react组件格式文件存入第二存储器中，包括：

5.根据权利要求4所述的方法，其特征在于，在将第一存储器中react属性的属性值为真值的各文件，作为成功转换得到的react组件格式文件存入第二存储器中之前，还包括：

6.根据权利要求4或5所述的方法，其特征在于，执行将各第一类各svg格式文件转换为react组件格式文件的操作，包括：

7.根据权利要求1-5任一项所述的方法，其特征在于，将第二存储器中存储的各react组件格式文件组建得到react图标组件库进行发布，包括：

8.一种react组件自动生成装置，其特征在于，包括：

9.一种电子设备，其特征在于，所述电子设备包括：

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机指令，所述计算机指令用于使处理器执行时实现权利要求1-7中任一项所述的一种react组件自动生成方法。

技术总结
本发明公开了一种React组件自动生成方法、装置、设备及介质。该方法包括：采集目标用户上传到文件存储系统中的图标文件，并将采集到的图标文件存入第一存储器中；将第一存储器中存储的各文件格式的图标文件，统一转换为SVG格式文件后，执行将各SVG格式文件转换为React组件格式文件的操作，将成功转换得到的React组件格式文件存入第二存储器中；将第二存储器中存储的React组件格式文件组建得到React图标组件库进行发布，以供目标用户访问和使用该React图标组件库。本发明实施例的技术方案针对每个目标用户做到了自定义组件生成的同时，提高了开发效率，保证了用户使用的及时性与一致性，提升用户使用感受。

技术研发人员：尚丹宁
受保护的技术使用者：北京优特捷信息技术有限公司
技术研发日：
技术公布日：2024/12/5