[发明专利]一种基于表单系统远程组件加载的创新方法

说明书

本发明涉及表单系统开发技术领域，具体为一种基于表单系统远程组件加载的创新方法，包括以下步骤：使用iframe标签+postMessage技术实现了前端应用跨域组件资源的开发；通过远程组件加载技术结合资源平台，进行表单系统前端应用组件模块化代码的管理实现了按需加载与热更新；有益效果为：本发明提出的基于表单系统远程组件加载的创新方法采用模块化开发技术使表单系统的vue前端框架可独立开发，降低项目之间的依赖关系，提高业务组件的复用性；主要用于解决依赖难于更新、维护的问题，实现表单系统前端应用开发场景中按需加载功能。提升组件隔离性，充分提高项目的整体运行速度，提升用户的使用体验。

技术领域

本发明涉及表单系统开发技术领域，具体为一种基于表单系统远程组件加载的创新方法。

背景技术

目前表单系统开发大多以html+css+js技术构建，除此以外webpack+vue框架、webpack+react框架等也是表单系统常用的前端开发框架。此类框架以快速交付、代码本地组件化为特点，能够适应敏捷开发的特性。

现有技术中，上述项目大多以工程为单位进行开发，即一个表单系统应用即以一个独立的项目形式进行开发、打包发布。虽然此类方式能够使用大量人力堆砌的方式实现快速交付，但是对于代码复用、模块管理机制以及前端系统间解耦，则不甚友好。尤其当存在相同、相似功能时，只能通过代码复制或以依赖包方式进行重组。

并且，上述方式存在如下弊端：

项目依赖情况不清晰，不利于后期维护；

无法针对特定的依赖进行针对升级，只能整体项目重新打包；

对于领域驱动设计方式不友好，无法做到针对业务领域的封装；

实现不了依赖包内的功能按需加载；

表单系统资源不同域的情况下无法直接加载资源；

系统进行多人协同开发时代码模块易冲突。

发明内容

本发明的目的在于提供一种基于表单系统远程组件加载的创新方法，以解决上述背景技术中提出的问题。

为实现上述目的，本发明提供如下技术方案：一种基于表单系统远程组件加载的创新方法，该方法包括以下步骤：

使用iframe标签+postMessage技术实现了前端应用跨域组件资源的开发；

通过远程组件加载技术结合资源平台，进行表单系统前端应用组件模块化代码的管理实现了按需加载与热更新。

优选的，远程组件开发包括以下方法：

安装远程组件开发插件；

新建组件文件编写业务代码；

使用开发插件结合前端应用进行组件的开发调试；

组件编写完成，使用开发插件将组件编译为资源包；

在资源平台添加组件的信息配置；

将组件资源包上传至资源平台。

优选的，安装远程组件开发插件时，开发者配置node环境安装npm插件，通过npm安装远程组件的开发插件；安装命令如下：npm install@jangod/iweb-cli-service-g，执行以上命令安装远程组件开发插件。

优选的，开发调试时，控制台执行iweb-cli-service publish即可按照提示进行开发插件配置文件的生成；通过配置开发插件实现本地项目与开发的远程组件进行联动调试。