一种单文件组件开发方法及装置、电子设备制造方法及图纸

本申请公开了一种单文件组件开发方法及装置、电子设备，所述方法包括：获取入口文件中的第一公共依赖组件；对所述第一公共依赖组件进行处理，得到浏览器可用的第二公共依赖组件；接收访问请求，基于所述访问请求从所述第二公共依赖组件获取目标公共依赖文件；基于所述访问请求获取目标组件文件，并对所述目标组件文件进行处理；将所述目标公共依赖文件和处理后的所述目标组件文件发送至所述浏览器。能够利用较短的时间完成组件构建，且应用范围广。

【技术实现步骤摘要】
一种单文件组件开发方法及装置、电子设备
本申请涉及网络服务
，尤其涉及一种单文件组件开发方法及装置、电子设备。
技术介绍
现有技术中组件的开发主要包括webpack开发模式和Vite开发模式。其中，webpack开发模式是基于配置的入口文件(entry)来递归的收集整个项目包的依赖组件，把所有的依赖组件全部构建输出；但是，对于单文件组件开发，因为全量依赖组件构建所需时间长，所以通常不需要全量依赖组件构建；针对大型前端项目，首次启动时需要编译构建数百个甚至更多的模块，所需的构建时间更长。针对某一模块的修改，则需要重新编译构建模块；因此，模块修改所需的时间由所述模块被依赖的次数决定，所述模块被依赖的次数越多，模块修改所需的时间越长，而且导致资源的耗费过多。Vite开发模式只有在用于构建用户界面的渐进式框架Vue3版本下才能正常运行；但是，由于现有技术中多应用Vue2版本，Vue3版本的发布时间短，应用范围小，导致Vite开发模式的应用范围小。显然，现有的两种方式，存在组件开发时间长，资源耗费过多，应用范围小等局限性。申本文档来自技高网...

【技术保护点】
1.一种单文件组件开发方法，其特征在于，所述方法包括：/n获取入口文件中的第一公共依赖组件；/n对所述第一公共依赖组件进行处理，得到浏览器可用的第二公共依赖组件；/n接收访问请求，基于所述访问请求从所述第二公共依赖组件获取目标公共依赖文件；/n基于所述访问请求获取目标组件文件，并对所述目标组件文件进行处理；/n将所述目标公共依赖文件和处理后的所述目标组件文件发送至所述浏览器。/n

【技术特征摘要】
1.一种单文件组件开发方法，其特征在于，所述方法包括：
获取入口文件中的第一公共依赖组件；
对所述第一公共依赖组件进行处理，得到浏览器可用的第二公共依赖组件；
接收访问请求，基于所述访问请求从所述第二公共依赖组件获取目标公共依赖文件；
基于所述访问请求获取目标组件文件，并对所述目标组件文件进行处理；
将所述目标公共依赖文件和处理后的所述目标组件文件发送至所述浏览器。


2.根据权利要求1所述的方法，其特征在于，所述对所述第一公共依赖组件进行处理，得到浏览器可用的第二公共依赖组件包括：
遍历所述第一公共依赖组件的源代码对应的第一抽象语法树节点，删除第一功能节点和路由节点；
确定所述抽象语法树节点中除所述功能节点和所述路由节点之外的节点对应的组件为第二公共依赖组件。


3.根据权利要求1所述的方法，其特征在于，所述对所述目标组件文件进行处理，包括：
对所述目标组件文件的源代码进行解析，得到模板部分、脚本部分和样式部分；
对所述样本部分、所述脚本部分和所述样式部分中至少之一进行处理。


4.根据权利要求3所述的方法，其特征在于，所述对所述模板部分、所述脚本部分和所述样式部分中至少之一进行处理，包括：
将所述模板部分赋值至用于构建用户界面的第一框架对应的函数；
对所述脚本部分进行预处理；
对所述函数和预处理后的所述脚本部分执行合并处理；
对所述合并处理的结果进行编译，得到所述第一框架组件的导出模块。


5.根据权利要求3所述的方法，其特征在于，所述对所述模板部分、所述脚本部分和所述样式部分中至少之一进行处理，包括：
对所述样式部分进行预处理；
遍历所述目标组件文件...

【专利技术属性】
技术研发人员：赖锐锋，林挺，
申请(专利权)人：深圳前海微众银行股份有限公司，
类型：发明
国别省市：广东;44