一种基于Vue框架的项目打包方法、装置及设备与流程

本申请涉及通信技术，尤其涉及一种基于vue框架的项目打包方法、装置及设备。

背景技术：

1、随着互联网的发展，web网站开发前后端分离已成为互联网项目开发的业界标准使用方式，各类web网站前端开发框架也相继涌出。

2、vue作为一套用于构建用户界面的渐进式js框架，主要适用于单页面的开发，也可以实现多页面的开发。当项目涉及到多个模块的开发时，基于vue框架的多模块项目的开发方式主要有多页面开发和微前端架构两种方式。

3、其中，vue多页面开发是多个页面之间的跳转，多页面跳转刷新所有资源，每个公共资源需选择性重新加载，存在不同页面之间跳转较慢、不同页面之间通信复杂等缺点。微前端架构将系统被拆成多个独立应用，每个应用都可以独立开发、独立运行、独立部署，再将这些小型应用联合为一个完整的应用，增加了学习成本、部署难度与时间，以及代码仓库的管理与维护。可以看出，vue多页面开发和微前端架构的工作量增加，降低开发效率。

技术实现思路

1、本申请提供一种基于vue框架的项目打包方法、装置及设备，用以解决学习成本高、部署难度增加以及开发效率低的问题。

2、一方面，本申请提供一种基于vue框架的项目打包方法，包括：

3、获取项目级配置文件内打包标识；项目基于vue框架，项目包括项目级配置文件和各个资源文件；项目级配置文件包括打包标识，在打包标识指示进行打包时项目级配置文件还包括资源提取程序代码；

4、在打包标识指示进行打包时，运行项目级配置文件内资源提取程序，获得待打包的资源；

5、对待打包的资源进行打包处理，获得打包文件。

6、在一种可能的实施方式中，各个资源文件包括：页面资源、初始化资源、过滤资源、路径资源和store资源；

7、其中，页面资源包括多个模块的资源文件；初始化资源包括各个模块在初始化时的js请求文件；过滤资源包括各个模块的过滤程序文件；路径资源包括各个模块的路由配置文件；store资源包括各个模块的store配置文件。

8、在一种可能的实施方式中，项目还包括公共资源和转换器资源；

9、公共资源包括样式资源、js资源、图标资源、字体资源、ui组件资源和公共业务组件；

10、转换器资源包括vue配置文件和入口文件。

11、在一种可能的实施方式中，在打包标识指示进行打包时，运行项目级配置文件内资源提取程序，获得待打包的资源，具体包括：

12、加载路由资源，在路由资源的入口文件运行路由资源提取程序，获得所需模块的路由配置列表；根据路由配置列表获得待打包模块的资源文件和待打包模块对应的公共资源；

13、加载store资源，在store资源入口文件运行store资源提取程序获得待打包模块的store配置对象信息；

14、运行资源提取程序在全局注册各个待打包模块的过滤程序；

15、运行资源提取程序获得各个待打包模块在初始化的js文件。

16、在一种可能的实施方式中，对待打包的资源进行打包处理，获得打包文件，具体包括：

17、对待打包模块的资源文件、待打包模块对应的公共资源、待打包模块在初始化的js文件进行打包，获得打包文件。

18、在一种可能的实施方式中，获取项目级配置文件内打包标识，具体包括：

19、加载vue配置文件，并从vue配置文件中读取配置信息入口；

20、根据配置信息入口获取项目级配置文件，并提取项目级配置文件中打包标识。

21、另一方面，本申请提供一种基于vue框架的项目打包装置，包括：

22、获取模块，用于获取项目级配置文件内打包标识；项目基于vue框架，项目包括项目级配置文件和各个资源文件；项目级配置文件包括打包标识，在打包标识指示进行打包时项目级配置文件还包括资源提取程序代码；

23、处理模块，用于在打包标识指示进行打包时，运行项目级配置文件内资源提取程序，获得待打包的资源；

24、处理模块还用于对待打包的资源进行打包处理，获得打包文件。

25、在一种可能的实施方式中，各个资源文件包括：页面资源、初始化资源、过滤资源、路径资源和store资源；

26、其中，页面资源包括多个模块的资源文件；初始化资源包括各个模块在初始化时的js请求文件；过滤资源包括各个模块的过滤程序文件；路径资源包括各个模块的路由配置文件；store资源包括各个模块的store配置文件。

27、另一方面，本申请提供一种电子设备，包括：处理器，以及与处理器通信连接的存储器；

28、存储器存储计算机执行指令；

29、处理器执行存储器存储的计算机执行指令，以实现如上任一实施方式所涉及的方法。

30、另一方面，本申请提供一种计算机可读存储介质，计算机可读存储介质中存储有计算机执行指令，计算机执行指令被处理器执行时用于实现如上任一实施方式所涉及的方法。

31、本申请提供的一种基于vue框架的项目打包方法、装置及设备，获取项目级配置文件内打包标识；该项目基于vue框架，包括项目级配置文件和各个资源文件；该项目级配置文件包括打包标识，该打包标识指示进行打包时，项目级配置文件还包括资源提取程序代码；在打包标识指示进行打包时，运行项目级配置文件内资源提取程序，获得待打包的资源，也就是说，通过项目级配置文件可以根据需求对所有资源文件进行提取；之后对待打包的资源进行打包处理，获得打包文件；由于设置打包标识仅对需要的文件资源进行标识配置并打包，无需打包所有资源文件，降低了部署难度；由于只在一个项目级配置文件内利用打包标识对需求的资源文件提取打包，避免了每个资源文件都要配置一次资源信息和打包标识的流程，减少了打包工作量，降低学习成本，提升开发效率。

技术特征：

1.一种基于vue框架的项目打包方法，其特征在于，包括：

2.根据权利要求1所述的方法，其特征在于，所述各个资源文件包括：页面资源、初始化资源、过滤资源、路径资源和store资源；

3.根据权利要求1或2所述的方法，其特征在于，所述项目还包括公共资源和转换器资源；

4.根据权利要求1或2所述的方法，其特征在于，在所述打包标识指示进行打包时，运行所述项目级配置文件内资源提取程序，获得待打包的资源，具体包括：

5.根据权利要求4所述的方法，其特征在于，对所述待打包的资源进行打包处理，获得打包文件，具体包括：

6.根据权利要求1或2所述的方法，其特征在于，获取项目级配置文件内打包标识，具体包括：

7.一种基于vue框架的项目打包装置，其特征在于，包括：

8.根据权利要求7所述的装置，其特征在于，所述各个资源文件包括：页面资源、初始化资源、过滤资源、路径资源和store资源；

9.一种电子设备，其特征在于，包括：处理器，以及与所述处理器通信连接的存储器；

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质中存储有计算机执行指令，所述计算机执行指令被处理器执行时用于实现如权利要求1至6任一项所述的方法。

技术总结
本申请提供一种基于Vue框架的项目打包方法、装置及设备。该方法包括：获取项目级配置文件内打包标识；项目基于Vue框架，项目包括项目级配置文件和各个资源文件；项目级配置文件包括打包标识，在打包标识指示进行打包时项目级配置文件还包括资源提取程序代码；在打包标识指示进行打包时，运行项目级配置文件内资源提取程序，获得待打包的资源；对待打包的资源进行打包处理，获得打包文件。本申请的方法，减少了打包工作量，降低学习成本，提升开发效率。

技术研发人员：唐明芳,宋雨伦,李大中,谢云龙,吕烨
受保护的技术使用者：中国联合网络通信集团有限公司
技术研发日：
技术公布日：2024/4/17