A rapid full-amount construction method and device and a storage medium

By generating configuration information and using virtual application scaffolding tools to filter sub-application code, a rapid full-scale build of the micro-frontend system is achieved, solving the problems of long build time and large package size, improving build efficiency and realizing resource sharing.

CN119917100BActive Publication Date: 2025-10-10GUANGZHOU XUANWU WIRELESS TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202411746076.9
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2024-12-02
Publication Date
2025-10-10
Estimated Expiration
2044-12-02

AI Technical Summary

Technical Problem

The traditional full-scale build method in micro-frontend systems results in long build times, low efficiency, and large deployment packages. Especially in multiple sub-application systems, it is difficult to effectively share resources and reduce repetitive work.

Method used

By obtaining public library and sub-application information, generating configuration information, and using virtual application scaffolding tools to filter and process sub-application code, the complete path resolution and sharing of resource files are achieved, the main application configuration information is generated, and a fast full build is performed, resources are shared, and repetitive work is reduced.

Benefits of technology

It achieves fast full build, improves build efficiency, reduces deployment package size, is suitable for resource sharing in any environment, and solves the problems of long build time and large package size in traditional methods.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119917100B_ABST
    Figure CN119917100B_ABST
Patent Text Reader

Abstract

The application discloses a kind of fast full-amount construction method, device and storage medium, method includes: obtaining public library information and sub-application information;According to public library information, generate public library configuration information;According to sub-application information, generate micro application configuration information;Source path in sub-application source code file is parsed, and resource file complete path is obtained;According to micro application configuration information and resource file complete path, filter processing is carried out to initial sub-application code using virtual application scaffold tool, and target sub-application code is obtained;According to micro application configuration information, generate main application configuration information;According to public library configuration information, target sub-application code and main application configuration information, carry out fast full-amount construction, and obtain main application and multiple sub-applications.The application realizes fast full-amount construction, improves efficiency, and reduces deployment package volume.The application can be widely applied to front-end construction technical field.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of front-end construction technology, and in particular to a fast full-scale construction method, device and storage medium. Background Art

[0002] In many enterprise applications, plug-in architecture is a common software architecture pattern. Micro-frontends can achieve this in the front-end. In a micro-frontend architecture, a large application is split into multiple sub-applications. While each sub-application can be independently packaged and deployed, if the project is handed off to non-front-end developers for maintenance, it can be difficult to determine which sub-application to package. Furthermore, if common code is modified, all sub-applications must still be packaged. Traditional full build methods package each sub-application sequentially, resulting in long build times, low efficiency, and large deployment packages.

[0003] In summary, the technical problems existing in the relevant technologies need to be improved. Summary of the Invention

[0004] The embodiments of the present invention provide a method, device and storage medium for rapid full-scale construction, which effectively improves efficiency and reduces the size of deployment packages.

[0005] In one aspect, an embodiment of the present invention provides a method for rapid full-scale construction, comprising the following steps:

[0006] Obtaining public library information and sub-application information, wherein the public library information includes a public library alias and a public library path, and the sub-application information includes a sub-application name, an entry file name, a startup port number, an open resource name, and an open resource path;

[0007] Generate public library configuration information according to the public library information;

[0008] Generate micro-application configuration information based on the sub-application information;

[0009] Parse the resource path in the sub-application source code file to obtain the complete path of the resource file, including the alias path or relative path;

[0010] According to the micro-application configuration information and the complete path of the resource file, the initial sub-application code is filtered using a virtual application scaffolding tool to obtain a target sub-application code, wherein the initial sub-application code includes a business code and a public resource code, and the target sub-application code includes the business code;

[0011] Generate main application configuration information based on the micro application configuration information;

[0012] According to the common library configuration information, the target sub-application code and the main application configuration information, a rapid full build is performed to obtain the main application and multiple sub-applications.

[0013] In some embodiments, generating public library configuration information according to the public library information includes:

[0014] Combining the public library alias and the public library path to obtain a public library alias path combination;

[0015] Add multiple public library alias path combinations to the first preset configuration file to obtain the public library configuration information.

[0016] In some embodiments, generating micro-application configuration information based on the sub-application information includes:

[0017] Combining the open resource name and the open resource path to obtain an open resource key-value pair;

[0018] The sub-application name, the entry file name, the startup port number and multiple open resource key-value pairs are added to the second preset configuration file to obtain the micro-application configuration information.

[0019] In some embodiments, when the source resource path is an alias path, parsing the source resource path in the sub-application source code file to obtain the complete path of the resource file includes:

[0020] According to the preset placeholder root path and the sub-application name, the alias in the alias-containing path is replaced to obtain the complete path of the resource file.

[0021] In some embodiments, when the resource path is a relative path, parsing the resource path in the sub-application source code file to obtain the complete path of the resource file includes:

[0022] Generate the resource file full path according to the source file full path and the relative path.

[0023] In some embodiments, filtering the initial sub-application code using a virtual application scaffolding tool based on the micro-application configuration information and the complete path of the resource file to obtain the target sub-application code includes:

[0024] Use preset plug-in settings to run shared configuration information;

[0025] Creating a plurality of sub-application federated objects according to the micro-application configuration information and the running shared configuration information;

[0026] Adding the plurality of sub-application federated objects to a sub-application plug-in queue;

[0027] Initialize the bucket object;

[0028] Traversing the file collection in the sub-application plug-in queue to add a first resource in the file collection that complies with a preset naming rule to the bucket object, and adding a reference resource of the first resource to the bucket object;

[0029] The initial sub-application code is filtered according to the bucket object and the complete path of the resource file to obtain the target sub-application code.

[0030] In some embodiments, generating main application configuration information based on the micro-application configuration information includes:

[0031] Determine the sub-application entry file loading path based on the micro-application configuration information;

[0032] Create the main application federation object;

[0033] Adding the main application federated object to the main application plug-in queue to configure the shared field and obtain shared field configuration information;

[0034] The main application configuration information is generated according to the sub-application entry file loading path, the sub-application name and the shared field configuration information.

[0035] On the other hand, an embodiment of the present invention provides a fast full-scale construction device, comprising:

[0036] The first module is used to obtain public library information and sub-application information, wherein the public library information includes the public library alias and the public library path, and the sub-application information includes the sub-application name, entry file name, startup port number, open resource name and open resource path;

[0037] The second module is used to generate public library configuration information according to the public library information;

[0038] The third module is used to generate micro-application configuration information based on the sub-application information;

[0039] The fourth module is used to parse the source resource path in the sub-application source code file to obtain the complete path of the resource file, wherein the source resource path includes an alias path or a relative path;

[0040] A fifth module is configured to filter the initial sub-application code using a virtual application scaffolding tool based on the micro-application configuration information and the complete path of the resource file to obtain a target sub-application code, wherein the initial sub-application code includes a business code and a public resource code, and the target sub-application code includes the business code;

[0041] The sixth module is used to generate main application configuration information according to the micro application configuration information;

[0042] The seventh module is used to perform a rapid full build based on the common library configuration information, the target sub-application code and the main application configuration information to obtain the main application and multiple sub-applications.

[0043] In another aspect, an embodiment of the present invention provides a computer device, comprising:

[0044] at least one processor;

[0045] at least one memory for storing at least one program;

[0046] When the at least one program is executed by the at least one processor, the at least one processor implements the method.

[0047] On the other hand, an embodiment of the present invention provides a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the method described above is implemented.

[0048] The beneficial effects of the present invention are as follows:

[0049] The embodiment of the present invention first obtains common library information and sub-application information, then generates common library configuration information based on the common library information, and generates micro-application configuration information based on the sub-application information, and then parses the source resource path in the sub-application source code file to obtain the complete path of the resource file, and uses a virtual application scaffolding tool to filter the initial sub-application code based on the micro-application configuration information and the complete path of the resource file to obtain the target sub-application code, and finally generates the main application configuration information based on the micro-application configuration information, and performs a rapid full build based on the common library configuration information, the target sub-application code and the main application configuration information to obtain the main application and multiple sub-applications, so that shared resources can be shared through multiple configuration information to achieve rapid full build, thereby improving efficiency and reducing the deployment package size.

[0050] Other features and advantages of the present invention will be described in the following description, and in part will become apparent from the description, or will be understood by practicing the present invention. The purpose and other advantages of the present invention can be realized and obtained through the structures particularly pointed out in the description and the drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0051] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the following will briefly introduce the drawings needed in the embodiment description. Obviously, the drawings in the following description only represent some embodiments of the present application, and for those skilled in the art, other drawings can also be obtained from these drawings without any creative effort.

[0052] Figure 1 A flow chart of a fast full-amount construction method according to an embodiment of the present application;

[0053] Figure 2 A schematic diagram of a path analysis process according to an embodiment of the present application;

[0054] Figure 3 A schematic diagram of an implementation process of a hook function according to an embodiment of the present application;

[0055] Figure 4 A schematic diagram of a traditional packaging construction process according to an embodiment of the present application;

[0056] Figure 5 A schematic diagram of a packaging construction process using virtual applications according to an embodiment of the present application;

[0057] Figure 6 A schematic diagram of a project structure according to an embodiment of the present application;

[0058] Figure 7 A structural schematic diagram of a fast full-amount construction device according to an embodiment of the present application;

[0059] Figure 8 A hardware structural schematic diagram of a computer device according to an embodiment of the present application. DETAILED DESCRIPTION

[0060] In order to make the objects, technical solutions and advantages of the present application clearer, the following will further describe the present application in combination with the drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application, and are not used to limit the present application. When the following description refers to the drawings, the same numbers in different drawings represent the same or similar elements unless otherwise indicated. The implementation manners described in the following exemplary embodiments do not represent all the implementation manners consistent with the embodiments of the present application, and they are only examples of devices and methods consistent with some aspects of the embodiments of the present application as detailed in the appended claims.

[0061] It will be understood that the terms "first", "second", etc. used in this application may be used herein to describe various concepts, but unless otherwise specified, these concepts are not limited by these terms. These terms are only used to distinguish one concept from another. For example, without departing from the scope of the embodiments of the present application, the first information may also be referred to as the second information, and similarly, the second information may also be referred to as the first information. Depending on the context, the words "if" and "if" as used herein may be interpreted as "at the time of" or "when" or "in response to determining".

[0062] The terms "at least one", "plurality", "each", "any", etc. used in this application include "at least one", "two" or more, "plurality" or "each", "any" or "any one", "each" or "any one" as used herein.

[0063] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by those skilled in the art to which this application pertains. The terms used herein are for the purpose of describing the embodiments of this application only and are not intended to limit this application.

[0064] Before explaining the embodiments of the present application in detail, some of the nouns and terms involved in the embodiments of the present application are first explained. The nouns and terms involved in the embodiments of the present application are subject to the following explanations.

[0065] Full build: This means starting the build process from scratch without considering previous build results.

[0066] Scaffolding: refers to development tools and development frameworks that can help developers use during the development process. Using scaffolding eliminates the need to build or write underlying software from scratch.

[0067] In the related art, plug-inization is a common software architecture pattern in many enterprise applications. The front-end concept can achieve plug-in-based functionality through micro-frontends. Currently, various technical solutions exist for implementing micro-frontends, such as "module federation." In a micro-frontend architecture, a large application is split into multiple micro-applications. While each micro-application can be independently packaged and deployed, changes to the micro-application's code can be packaged only for that micro-application. However, if common code is modified, each micro-application still needs to be packaged. Furthermore, if the project is handed over to a non-front-end developer for maintenance, even if they only modify individual images or text, it can be difficult for them to determine which micro-application to package without understanding the project architecture. Therefore, for plug-in systems, a full build ensures that the deployment package is correct and up-to-date after each build and eliminates the need for maintenance personnel to understand the project architecture. However, full builds can also pose serious challenges, such as long build times, low efficiency, and large deployment packages.

[0068] In the packaging method of the prior art micro-frontend system, whether to build a full build or to package certain sub-applications is determined by configuration parameters. If it is a full build, the main application and each sub-application are packaged separately and output to their respective containers. If it is not a full build, the public library configuration information is obtained, only the corresponding sub-application is packaged, and the compiled deployment file is output to the container corresponding to the sub-application. In addition, an application configuration file is described that describes the packaging configuration information of each application. The problem that this embodiment can solve is to reduce the total build time and total package size of the system for the scenario of full build. If it is a system that includes dozens of sub-applications, then this is a serious problem.

[0069] Prior art also describes how to split a large, single application into a micro-application system composed of multiple small applications, as well as how to manage projects containing multiple micro-applications after the split, and how to configure code sharing between multiple micro-applications to reduce duplication of work. This approach utilizes a micro-frontend technology solution called "Qiankun," splitting a large, single application into multiple small applications and using Monorepo / Yarn to manage the code for these micro-applications. One function of a Monorepo is to facilitate the sharing of common code between multiple applications. Qiankun achieves the micro-frontend effect through routing distribution. Using Qiankun and Monorepo, a micro-frontend architecture is achieved by splitting a single application into multiple micro-applications. Regarding code sharing, there are three levels. The first level involves physical code sharing. For example, if two projects A and B share a method F, without sharing, the code implementation of the same method F would be written separately in projects A and B. At the first level, physical code sharing implements the shared method F in a single location, allowing both projects A and B to reference it. The second level of sharing achieves runtime sharing on top of the first level of physical sharing. Runtime non-sharing manifests itself as follows: although projects A and B reference the same code, each creates an instance object in memory upon startup. Runtime sharing, on the other hand, means that projects A and B reference the same instance object upon execution. The third level of sharing achieves complete sharing in the production environment on top of the second level of sharing. Production non-sharing manifests itself as follows: after projects A and B are packaged and compiled, the generated deployment files both contain the code for the shared method F. When project A runs, it first loads the file containing the F code and creates an instance object of the F code. When project B runs, it uses the existing instance object for method F. If not, it loads the code file containing method F from project B and creates an instance object. In production environment sharing, only the deployment file generated by project A contains the code for shared method F, while the file generated by project B does not. Therefore, when project B runs, it always uses the instance object corresponding to method F created in project A. Even if project B does not already have the instance object, it still uses project A to load the F code file and create the instance object. Traditional code sharing and reuse usually uses the Monorepo tool to achieve the first-level physical sharing of code.The sharing described in this embodiment is to achieve complete sharing of the third-tier production environment. In addition to code reuse and reduced repetitive development, complete sharing of the production environment has two other advantages: ① The files generated by the compilation of project B after packaging do not contain public methods, so the size of the deployment package is naturally reduced; ② When the system starts and runs, it must use instance objects of the common methods created by project A, so the memory space occupied is small, which can reduce the page rendering time.

[0070] The prior art also describes the problem of resource sharing between various micro-applications in a micro-frontend system, and adopts the following solution: ① Use CDN / Webpack externals to configure the three packages of vue, vue-router, and vuex to be shared. After packaging and building, the files generated after the compilation of all micro-applications do not contain the code of these three shared packages, so that the third-layer production environment is fully shared. However, this method has obvious limitations and problems. This method is only suitable for third-party libraries, that is, third-party libraries that the package.json file depends on, and third-party manufacturers provide CDN links. Some manufacturers do not provide CDN resource links, and if the CDN link fails, it will cause the entire system to fail to operate. It is not applicable to projects running on the intranet. CDN is an external network link. The sharing described in this embodiment is to solve the sharing of all public resources between micro-applications. It may include more than a dozen third-party libraries and several public libraries implemented internally by the project. It has no CDN restrictions, does not rely on the external network, and is suitable for deployment in any environment. ② A limited number of public components, such as AlarmControl and CompareControl, are encapsulated in the main application for use by sub-applications. This also requires exporting them to the sub-applications through the main application's webpack configuration. These components need to be imported in the sub-applications before they can be used. This method of sharing public components is cumbersome, so only a limited number of public components are supported. Furthermore, this method is not applicable to micro-frontend systems using Vite as a scaffold. In Vite scaffolding, the main application cannot export public components for use by sub-applications. This embodiment can solve this problem by storing dozens of business public components in a separate directory instead of implementing them in a specific micro-application. These dozens of business public components can be conveniently referenced and shared by all micro-applications without the need for tedious import and export. Business public components implemented within the project can be configured and shared in the same way as third-party libraries. ③ Public resources include styles, fonts, icons, images, and Theme variables. These resources are shared with sub-applications by placing them under the pulibc of the main application. However, there is a problem with this method. The resources under public will not be optimized by the program after packaging and building, and will be output as is. For example, some resources under public have not been used, but will still be output as is after packaging and building. However, the files in other directories will be automatically optimized by the program when they are packaged and built, and the resources that are not referenced will be automatically deleted.The sharing scope involved in this embodiment is wider, including not only the limited third-party libraries that provide CDN links in package.json, but also all third-party resources (there may be more than a dozen) and public libraries implemented within several projects. The public libraries implemented within the project may contain dozens of business public components. It is a simpler way to achieve resource sharing between micro-applications without the need for tedious import and export between micro-applications. All resources, whether components, pictures, fonts, or styles, can be packaged and optimized, and are also suitable for intranet environments without CDN. In addition to resource sharing, this embodiment also solves the problem of too long a total packaging and construction time and too large a total volume for plug-in systems containing many sub-applications.

[0071] The embodiment of the present application provides a method for rapid full-scale construction, which relates to the field of front-end construction technology. The embodiment of the present application provides a method for rapid full-scale construction that can be applied to a terminal, a server, or software running on a terminal or a server. In some embodiments, the terminal can be a smart phone, a tablet computer, a laptop computer, a desktop computer, a smart speaker, a smart watch, and a car terminal, etc., but is not limited to this; the server side can be configured as an independent physical server, or as a server cluster or distributed system composed of multiple physical servers, or as a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms. The server can also be a node server in a blockchain network; the software can be an application that implements a rapid full-scale construction method, etc., but is not limited to the above forms.

[0072] The present application can be used in many general or special computer system environments or configurations. For example: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer electronics, network PCs, minicomputers, mainframe computers, distributed computing environments including any of the above systems or devices, and the like. The present application can be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, and the like that perform specific tasks or implement specific abstract data types. The present application can also be practiced in distributed computing environments in which tasks are performed by remote processing devices connected via a communication network. In a distributed computing environment, program modules can be located in local and remote computer storage media, including storage devices.

[0073] The following is a detailed explanation of the embodiments of the present application with reference to the accompanying drawings:

[0074] Figure 1 This is an optional flowchart of a fast full-scale construction method provided in an embodiment of the present application. Figure 1 The method may include but is not limited to steps S101 to S107.

[0075] Step S101: Obtain public library information and sub-application information. The public library information includes the public library alias and public library path. The sub-application information includes the sub-application name, entry file name, startup port number, open resource name, and open resource path.

[0076] Step S102: Generate public library configuration information based on the public library information;

[0077] Step S103: Generate micro-application configuration information based on the sub-application information;

[0078] Step S104: Parse the resource path in the sub-application source code file to obtain the complete path of the resource file, where the resource path includes an alias path or a relative path.

[0079] Step S105: Filter the initial sub-application code using a virtual application scaffolding tool based on the micro-application configuration information and the complete path of the resource file to obtain the target sub-application code. The initial sub-application code includes the business code and the public resource code, and the target sub-application code includes the business code.

[0080] Step S106: Generate main application configuration information based on the micro application configuration information;

[0081] Step S107: Perform a rapid full build based on the common library configuration information, the target sub-application code, and the main application configuration information to obtain the main application and multiple sub-applications.

[0082] Steps S101 to S107 shown in the embodiment of the present application achieve rapid full-scale construction, improve efficiency, and reduce the size of the deployment package.

[0083] In step S101 of some embodiments, public library information can be obtained through a public resource platform, and sub-application information can be obtained by parsing the sub-application to be packaged. Public library information and sub-application information can also be obtained through other methods, not limited to these. The public library information includes the public library alias and the public library path, and the sub-application information includes the sub-application name, entry file name, startup port number, open resource name, and open resource path.

[0084] In some embodiments, in step S102, generating public library configuration information based on public library information may include but is not limited to the following steps:

[0085] Combine the public library alias and the public library path to obtain a public library alias path combination;

[0086] Add multiple public library alias path combinations to the first preset configuration file to obtain public library configuration information.

[0087] In some embodiments, at the physical code level, all public libraries within the project are configured to be shared (can be referenced by all sub-applications). The public library alias and public library path can be combined first to obtain a public library alias path combination, and then multiple public library alias path combinations are added to the first preset configuration file to obtain public library configuration information. By configuring the public library alias and public library path in the tsconfig.json (first preset configuration file) and vite scaffolding of each sub-application. In each sub-application, the methods, components, instructions, etc. provided by the public library can be referenced by alias. Exemplarily, the program code of the public library alias path combination can be expressed as: {find:"@icc / utils", replacement:resolve(projectsDir,". / icc-ui / packages / utils")}, where find represents the public library alias and replacement represents the public library path.

[0088] In some embodiments, in step S103, generating micro-application configuration information based on the sub-application information may include but is not limited to the following steps:

[0089] Combine the open resource name and the open resource path to obtain an open resource key-value pair;

[0090] The sub-application name, entry file name, startup port number and multiple open resource key-value pairs are added to the second preset configuration file to obtain micro-application configuration information.

[0091] In some embodiments, the open resource name and the open resource path can be combined to obtain an open resource key-value pair, and then the sub-application name (name field), the entry file name (filename field), the startup port number (port field) and multiple open resource key-value pairs are added to the second preset configuration file to obtain the micro-application configuration information. For example, the program code of the open resource key-value pair can be expressed as: "patchAuditCheck": "src / views / patch-audit / check.vue", and there can be multiple open resource key-value pairs of this form, all stored in the exposes field, indicating that they can be opened to other applications for use, where "patchAuditCheck" represents the open resource name and "src / views / patch-audit / check.vue" represents the open resource path. It is understandable that the information related to all sub-applications is defined in a microinfo.json configuration file (the second preset configuration file), so that the main application can read this file to obtain the relevant data of all sub-applications, and the virtual application can also read this configuration file to batch obtain the code files exported by all sub-applications for a build. Furthermore, the sub-application data configuration format can be: In the Federation micro-frontend architecture pattern, exposes is used to specify which resources in the current sub-application can be used by the main application. Exposes are defined as key-value pairs, where the key represents the resource name and the value corresponds to the resource's path. In the main application, dynamic import can be used to find the corresponding path (value) based on the resource name (key), thereby loading and displaying these resources.

[0092] In some embodiments, in step S104, when the source resource path is a path containing an alias, parsing the source resource path in the sub-application source code file to obtain the complete path of the resource file may include but is not limited to the following steps:

[0093] According to the preset placeholder root path and sub-application name, replace the alias in the alias path to obtain the full path of the resource file.

[0094] In some embodiments, a vite.config.ts scaffolding configuration file is created in the root directory of the project, and the project contains multiple sub-applications, a main application, and multiple public libraries. During the packaging and building process, the entire project is treated as a virtual application, which contains the business codes of all sub-applications and the codes of public libraries. The vite.config.ts scaffolding configuration file in the root directory of the project is the scaffolding configuration of the virtual application. This embodiment realizes code sharing between sub-applications at the physical level through alias configuration. In addition to configuring aliases for all public libraries, you can also give aliases to the code somewhere within a single application, which can simplify the reference path of the code within a single application. For example, the alias of the path where the source code src of a single application is located is configured as the "@" symbol. In the scaffolding configuration file of the virtual application, special processing needs to be done on the aliases within a single application, by setting placeholders for replacement (placeholder replacement) and overriding the implementation of path resolution in the customResolver (custom resolution resource) method. The ${microName} placeholder is used in replacement to represent the root path of a sub-application, and microName represents the name of the sub-application. The path resolution process is as follows Figure 2As shown, the customResolver method first determines whether the referenced resource file path updatedId contains the placeholder ${microName}, parses the current sub-application from the source resource file path by using a regular expression, replaces the placeholder with the name of the sub-application, so that the referenced resource path updatedId is completely determined, and finally returns the loaded resource by using the resolve method provided by the scaffold. When the source path is an alias path, the alias in the alias path can be replaced according to the preset placeholder root path and the name of the sub-application to obtain the complete resource file path. Exemplarily, in the sub-application source code file projects / standard / src / views / passport / login / index.vue, there is an alias path "@ / router / modules / msgs". When parsing this line of code, the @ symbol is encountered. The @ symbol can be replaced by using the preset placeholder root path ". / projects / ${microName} / src" to obtain the referenced resource path ". / projects / ${microName} / src / router / modules / msgs", and then the placeholder ${microName} is replaced by using the name of the sub-application standard to obtain the complete resource file path ". / projects / standard / src / router / modules / msgs". Further, the file under the complete resource file path can be read, and the file is parsed by using the resolve method to obtain the method provided by the file.

[0095] In some embodiments, when the source path is a relative path in step S104, the source path in the sub-application source code file is parsed to obtain the complete resource file path, which can include but is not limited to the following steps:

[0096] According to the source file complete path and the relative path, the complete resource file path is generated.

[0097] In some embodiments, when the source resource path is a relative path, the full path of the resource file can be generated based on the full path of the source file and the relative path. For example, in the sub-application source code file, the methods provided by other files are not referenced with the @ symbol, but directly referenced through the relative path. The relative path is: ".. / .. / .. / router / modules / msgs". Then, the prefix path "projects / standard / src / " can be found directly through the full path of the source file "projects / standard / src / views / passport / login / index.vue", and the ".. / .. / .. / " symbol can be replaced to obtain the full path of the resource file "project / standard / src / router / modules / msgs", and then the resource is resolved and returned through the resolve method. It can be understood that a ".. / " represents a return to the previous file level.

[0098] In some embodiments, in step S105, the initial sub-application code is filtered using a virtual application scaffolding tool based on the micro-application configuration information and the complete path of the resource file to obtain the target sub-application code, which may include but is not limited to the following steps:

[0099] Use preset plug-in settings to run shared configuration information;

[0100] Create multiple sub-application federation objects based on the micro-application configuration information and running shared configuration information;

[0101] Add multiple sub-application federated objects to the sub-application plug-in queue;

[0102] Initialize the bucket object;

[0103] Traverse the file collection in the sub-application plug-in queue to add the first resource in the file collection that meets the preset naming rules to the bucket object, and add the reference resource of the first resource to the bucket object;

[0104] Based on the bucket object and the complete path of the resource file, the initial sub-application code is filtered to obtain the target sub-application code.

[0105] In some embodiments, the shared configuration information can be set up using a preset plug-in. For example, the "@originjs / vite-plugin-federation" plug-in can be used to configure shared (shared field) to achieve runtime sharing of all public codes, including public libraries introduced in third-party package.json (including those that provide a CDN link or do not provide a CDN link) and public libraries implemented within the project (which can include any number). These public codes are configured as shared through the shared field provided by the plug-in, so that when running, the sub-application will give priority to the instance objects created by the public code provided by the main application. For example, third-party public libraries can include: vue, vue-router, vuex, @vueuse / core, @vueuse / rxjs, ant-design-vue, @ant-design / icon-vue, lodash, tiny-emitter, axios, echarts, core-js, dayjs, pinia, date-fns, rxjs, etc. Internal public libraries of the project may include: @icc / store, @icc / api, @icc / hooks, @icc / utils, @icc / msg, @icc / directives, @icc / components, @icc / apppush, @icc / jy, @icc / email, @icc / rcs5g, @icc / sms, @icc / isms, @icc / tiktok, @icc / videoSms, @icc / voice, @icc / wechat, @icc / workwx, etc.

[0106] Then, based on the micro-application configuration information and the runtime shared configuration information, multiple sub-application federation objects are created and added to the sub-application plug-in queue. For example, the effect of batch packaging of sub-applications can be achieved by adding the federation provided by the "@originjs / vite-plugin-federation" plug-in to the plug-in queue of the vite scaffold. The micro-application configuration information in the microinfo.json configuration file (micro-information configuration file) is read to obtain all sub-application information. A federation object (sub-application federation object) is created for each sub-application and added to the sub-application plug-in queue. The bucket object is then initialized, and the file collection in the sub-application plug-in queue is traversed to add the first resource in the file collection that meets the preset naming rules to the bucket object, and the reference resource of the first resource is added to the bucket object. Finally, based on the bucket object and the complete path of the resource file, the initial sub-application code is filtered to obtain the target sub-application code. For example, the custom plug-in "patch:federation" can be used to achieve complete sharing of all public code (third-party libraries, project internal public libraries) in the production environment. Create a custom plugin "patch:federation" and implement filtering of all public resource files in the generateBundle hook function. Add this custom plugin "patch:federation" to the plugin queue. The implementation process of the generateBundle hook function is as follows: Figure 3 As shown, a "bucket" (also called a bucket object) is created. All resource bundles (file collections) are iterated over. Resources starting with "federation_expose" (i.e., the pre-set naming convention) are added to the bucket. References to these resources (i.e., referenced resources), such as CSS, images, chunks (JS), and references in recursive references, are also added to the bucket. Finally, the bundle is iterated over again as the initial sub-application code, and any resources not in the bucket are deleted. This process results in the generated target sub-application code containing only the business code, with all other common resources filtered out. Understandably, in the packaging process, a bundle refers to the result of consolidating multiple independent files and modules into one or more separate files. Processed by the build tool, a bundle is the final static file that can be loaded directly by the browser. Simply put, a bundle is a file or collection of files containing application code and resources, ultimately deployed to a server and consumed by the browser. The final stage of package parsing will output many file collections (also called bundles). Among them, the resources exported by sub-applications will have the file name starting with federation_expose after packaging.

[0107] Furthermore, by creating vite.config.ts in the project root directory as the scaffolding configuration for the virtual application, you can batch process the packaging tasks for all sub-application business codes. In the virtual application scaffolding configuration, placeholders and custom resource resolution are used to handle the aliases from each sub-application or the full paths of all referenced resource files within the sub-application. Multiple federation objects are added to the plugin queue to handle the parsing of the business code exported by each sub-application. Finally, a custom path:federation plugin is added to the plugin queue to filter out files generated after compilation and parsing from public libraries (including third-party libraries and public libraries within the project). Only files containing the keyword federation_expose in the file name, that is, files generated by the sub-application business code, are retained to ensure full sharing of the production environment and minimize the size of the deployment package.

[0108] In some embodiments, in step S106, generating main application configuration information based on the micro-application configuration information may include but is not limited to the following steps:

[0109] Determine the sub-application entry file loading path based on the micro-application configuration information;

[0110] Create the main application federation object;

[0111] Add the main application federated object to the main application plug-in queue to configure the shared fields and obtain the shared field configuration information;

[0112] Generate the main application configuration information based on the sub-application entry file loading path, sub-application name and shared field configuration information.

[0113] In some embodiments, a vite.config.ts file (main application configuration file) is created in the root directory of the main application for packaging and building the main application. The sub-application entry file loading path can be determined first according to the micro-application configuration information. Exemplarily, the micro-application configuration information can be read and all sub-applications can be traversed to determine the entry file loading path of the sub-application. The main application federation object is then created, and the main application federation object is added to the main application plug-in queue to configure the shared field and obtain the shared field configuration information. Exemplarily, a federation plug-in object (i.e., the main application federation object) can be created and added to the main application plug-in queue to configure the shared field and obtain the shared field configuration information. Exemplarily, a federation plug-in object (i.e., the main application federation object) can be created and added to the main application plug-in queue to configure the shared field. The federation plug-in object is configured to generate corresponding shared resource files after the shared field (shared field) is packaged and built, and shared field configuration information is generated so that the shared resource objects loaded by the main application can be directly used in the sub-application. Finally, according to the sub-application entry file loading path, the sub-application name and the shared field configuration information, the main application configuration information is generated. Exemplarily, the mapping object of remotes (remote warehouse), the sub-application name and the sub-application entry file loading path can be configured so that the resource files corresponding to the sub-application can be found by name in the main application. It is understandable that since there can be multiple sub-applications, there can also be multiple sub-application federated objects, but there is only one main application, so there is only one main application federated object. The attribute status of the sub-application federated object is different from that of the main application federated object.

[0114] In some embodiments, in step S107, a full build can be quickly performed based on the common library configuration information, the target sub-application code, and the main application configuration information to obtain the main application and multiple sub-applications. For example, this embodiment optimizes the full build from the traditional 1+N (sub-application) build execution commands to 1+1 build execution commands. Even if the functions of the later projects are continuously iterated and the number of sub-applications in the plug-in system continues to increase, the package build still executes 1+1 build commands. Among them, the traditional package build process is as follows: Figure 4 As shown in the figure, the packaging and building process of virtual applications is as follows Figure 5 Because executing multiple build commands in parallel consumes a lot of server CPU resources and can easily lead to the failure of the entire packaging task due to insufficient memory, each build command can be executed in serial mode.

[0115] In some embodiments, the project structure is as follows: Figure 6As shown, in the plug-in system, the sample project has a main application (standard) and 10 sub-application plug-ins. Each sub-application contains the source code src and the scaffolding configuration vite.config.ts. All sub-applications rely on the third-party library node_modules and the internal shared public library icc-ui. When using the traditional full-scale build method, the more complex the plug-in system, the more sub-applications it contains, the more public libraries it contains, the longer the total build time of the full-scale build, and the larger the total size of the deployment package. When using the method of this embodiment, as the number of sub-applications increases, the total build time and the total size of the deployment package remain unchanged, which is more efficient than the traditional method.

[0116] In some embodiments, for a normal full build of a plug-in system, each sub-application and the main application need to execute the build command, and each sub-application will output shared public resource files after being built. The final results are: (1) total packaging and building time: (one main application + N sub-application plug-ins) * packaging and building time for a single application; (2) total deployment package size: (one main application + N sub-application plug-ins) * single application deployment package size; (3) although the build time and deployment package size of each sub-application are different, these differences are usually not significant. However, as the number of sub-application plug-ins increases, the total construction time and the total deployment package size will increase linearly. This embodiment uses a virtual application to carry the business code parsing and compilation tasks exported by all sub-applications. In this way, only one main application and one virtual application need to be packaged, and there is no need to package multiple sub-applications separately. In addition, shared public resources are only output in the main application. In the virtual application build plug-in queue, the patch:federation plug-in filters out all public library files at the end and only outputs files generated by its own business code. When it reaches the production environment, it is fully shared, thereby solving the problem of excessive deployment package size after the plug-in system is built. The size of the final output deployment package is close to the size of a single application. In addition, this superimposed packaging model has minimal impact on the total build time and total package size when the number of sub-applications increases, avoiding the disadvantage of linear growth. The beneficial effects include: (1) Regardless of how many sub-applications are included in the project, the total build time is the time it takes to package a main application and a virtual container application that carries the sub-applications, which is equivalent to the time it takes to package and build two single applications. (2) The total size of the deployment package: the files generated corresponding to the business code + a file generated by a public shared resource, is close to the size of the deployment package generated after packaging a single application. (3) As the number of sub-application plug-ins increases in the later stage, the impact on the total build time and total size will be very limited. This embodiment was experimentally tested. The plug-in system includes 1 main application and 10 sub-applications. In the test results, for the total local build time, the traditional packaging method takes about 700 seconds, and the method of this embodiment takes about 120 seconds; for the total automated packaging build time, the traditional packaging method takes about 35 minutes, and the method of this embodiment takes about 12 minutes; for the total size of the deployment package, the traditional packaging method is about 200M, and the method of this embodiment is about 16.7M.

[0117] The beneficial effects of implementing the embodiments of the present application include that the embodiments of the present application first acquire public library information and sub-application information, then generate public library configuration information according to the public library information, and generate micro-application configuration information according to the sub-application information, then parse the source resource paths in the sub-application source code file to obtain complete resource file paths, and according to the micro-application configuration information and the complete resource file paths, filter the initial sub-application code using a virtual application scaffolding tool to obtain target sub-application code, and finally generate main application configuration information according to the micro-application configuration information, and perform rapid full-quantity construction according to the public library configuration information, the target sub-application code and the main application configuration information, to obtain a main application and multiple sub-applications, so that shared resources can be shared through various configuration information to achieve rapid full-quantity construction, thereby improving efficiency and reducing deployment package size.

[0118] In some embodiments, the present embodiment only needs to package the public resources once to package the sub-applications, without repeatedly packaging the public resources each time the sub-applications are packaged, thereby reducing the total time of full-quantity construction. At the same time, the file after the sub-application is packaged only contains the business code of the sub-application, without containing the public resource code, thereby reducing the overall size of the deployment package, and maximizing the reduction of the impact of the increase in the number of sub-applications on the packaging construction, avoiding the linear growth of the construction time and volume with the number of sub-applications. At the same time, the present application creates a vite configuration file in the project root directory as a virtual application scaffolding to carry all the batch packaging tasks of the sub-applications. In the vite scaffolding, on the one hand, the problem of inconsistent alias path mapping defined in the single sub-application needs to be solved, and on the other hand, a federation object provided by the vite-plugin-federation plug-in is created for each sub-application to join the plug-in queue to process the code files exported from each sub-application, and a custom patch:federation plug-in is added to the end of the plug-in queue to filter the files in the generateBundle hook function, and only output the files generated by the business code compilation. This can effectively solve the problems of long full-quantity construction time and large deployment package size in the plug-in system, and optimize the 1+N build commands to only need to execute 1+1 build commands, and the deployment package size is close to that of a single application.

[0119] Furthermore, by creating a virtual application and configuring a Vite scaffold in the system root directory, customizing the path resolution method using placeholders, this solves the problem of inconsistent alias path mappings defined within individual sub-applications. This allows all sub-applications to be packaged in batches within the virtual application, achieving a cumulative packaging effect. This approach consolidates multiple sub-applications into a single virtual application, significantly reducing overall system build time. Even as the number of sub-applications increases, the impact on package quality is minimal. By customizing the patch:federation plugin and adding it to the build queue at the end, the plugin's generateBundle hook filters all compiled files from public code to only include files generated by business code (filenames containing federate_expose). This allows for full sharing in production environments, not only for third-party libraries with or without CDN links, but also for multiple public libraries defined within the project. This streamlined sharing process eliminates the need for complex import and export processes. This minimizes the size of the plugin system's deployment package, making it similar to a single application. It also makes it suitable for deployment in intranet environments. Even as project complexity grows and the number of common components increases, sharing only requires configuring an alias and the shared field. After packaging, only one shared file is generated.

[0120] like Figure 7 As shown, an embodiment of the present invention further provides a fast full-scale construction device, comprising:

[0121] The first module 801 is used to obtain public library information and sub-application information. The public library information includes the public library alias and public library path. The sub-application information includes the sub-application name, entry file name, startup port number, open resource name and open resource path.

[0122] The second module 802 is used to generate public library configuration information according to the public library information;

[0123] The third module 803 is used to generate micro-application configuration information based on the sub-application information;

[0124] The fourth module 804 is used to parse the source resource path in the sub-application source code file to obtain the complete path of the resource file, where the source resource path includes an alias path or a relative path;

[0125] The fifth module 805 is used to filter the initial sub-application code using a virtual application scaffolding tool based on the micro-application configuration information and the complete path of the resource file to obtain the target sub-application code, where the initial sub-application code includes the business code and the public resource code, and the target sub-application code includes the business code;

[0126] The sixth module 806 is used to generate main application configuration information according to the micro application configuration information;

[0127] The seventh module 807 is used to perform a rapid full build based on the common library configuration information, the target sub-application code and the main application configuration information to obtain the main application and multiple sub-applications.

[0128] The contents of the above method embodiments are all applicable to the present device embodiments. The functions specifically implemented by the present device embodiments are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0129] like Figure 8 As shown, an embodiment of the present invention further provides a computer device, including:

[0130] at least one processor 901;

[0131] At least one memory 902, configured to store at least one program;

[0132] When at least one program is executed by at least one processor, the at least one processor implements Figure 1 The method shown.

[0133] The contents of the above method embodiments are all applicable to the present device embodiments. The functions specifically implemented by the present device embodiments are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0134] The embodiment of the present invention further provides a computer-readable storage medium, which stores a computer program, which is executed by a processor to implement Figure 1 The method shown.

[0135] The contents of the above method embodiments are all applicable to the present storage medium embodiment. The functions specifically implemented by the present storage medium embodiment are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0136] The preferred embodiments of the present invention are described above with reference to the accompanying drawings, but are not intended to limit the scope of the present invention. Any modifications, equivalent substitutions, and improvements made by those skilled in the art without departing from the scope and essence of the present invention should be within the scope of the present invention.

Claims

1. A fast full-scale construction method, characterized in that: The following steps are involved: Obtaining public library information and sub-application information, wherein the public library information includes a public library alias and a public library path, and the sub-application information includes a sub-application name, an entry file name, a startup port number, an open resource name, and an open resource path; Generate public library configuration information according to the public library information; Generate micro-application configuration information based on the sub-application information; Parse the resource path in the sub-application source code file to obtain the complete path of the resource file, including the alias path or relative path; Based on the micro-application configuration information and the complete path of the resource file, the initial sub-application code is filtered using a virtual application scaffolding tool to obtain the target sub-application code, wherein the initial sub-application code includes the business code and the public resource code, and the target sub-application code includes the business code. The virtual application is used to read the micro-application configuration information to batch obtain the code files exported by all sub-applications for a single build, and the virtual application includes the business code of all sub-applications and the code of the public library; Generate main application configuration information based on the micro application configuration information; Perform a fast full build based on the common library configuration information, the target sub-application code, and the main application configuration information. The full build only requires packaging a main application and a virtual application to obtain a main application and multiple sub-applications. Generating micro-application configuration information according to the sub-application information includes: Combining the open resource name and the open resource path to obtain an open resource key-value pair; Add the sub-application name, the entry file name, the startup port number and the plurality of open resource key-value pairs to a second preset configuration file to obtain the micro-application configuration information; Generating main application configuration information according to the micro-application configuration information includes: Determine the sub-application entry file loading path based on the micro-application configuration information; Create the main application federation object; Adding the main application federated object to the main application plug-in queue to configure the shared field and obtain shared field configuration information; The main application configuration information is generated according to the sub-application entry file loading path, the sub-application name and the shared field configuration information.

2. The method according to claim 1, characterized in that The generating of public library configuration information according to the public library information includes: Combining the public library alias and the public library path to obtain a public library alias path combination; Add multiple public library alias path combinations to the first preset configuration file to obtain the public library configuration information.

3. The method according to claim 1, characterized in that When the resource path contains an alias path, the resource path in the sub-application source code file is parsed to obtain the complete path of the resource file, including: According to the preset placeholder root path and the sub-application name, the alias in the alias-containing path is replaced to obtain the complete path of the resource file.

4. The method according to claim 1, wherein When the resource path is a relative path, the resource path in the sub-application source code file is parsed to obtain the complete path of the resource file, including: Generate the resource file full path according to the source file full path and the relative path.

5. The method according to claim 1, wherein The method of filtering the initial sub-application code using a virtual application scaffolding tool according to the micro-application configuration information and the complete path of the resource file to obtain the target sub-application code includes: Use preset plug-in settings to run shared configuration information; Creating a plurality of sub-application federated objects according to the micro-application configuration information and the running shared configuration information; Adding the plurality of sub-application federated objects to a sub-application plug-in queue; Initialize the bucket object; Traversing the file collection in the sub-application plug-in queue to add a first resource in the file collection that complies with a preset naming rule to the bucket object, and adding a reference resource of the first resource to the bucket object; The initial sub-application code is filtered according to the bucket object and the complete path of the resource file to obtain the target sub-application code.

6. A device for implementing the rapid full-scale construction method according to any one of claims 1 to 5, characterized in that: include: The first module is used to obtain public library information and sub-application information, wherein the public library information includes the public library alias and the public library path, and the sub-application information includes the sub-application name, entry file name, startup port number, open resource name and open resource path; The second module is used to generate public library configuration information according to the public library information; The third module is used to generate micro-application configuration information based on the sub-application information; The fourth module is used to parse the resource path in the sub-application source code file to obtain the complete path of the resource file, wherein the resource path includes an alias path or a relative path; A fifth module is configured to filter the initial sub-application code using a virtual application scaffolding tool based on the micro-application configuration information and the complete path of the resource file to obtain a target sub-application code, wherein the initial sub-application code includes a business code and a public resource code, and the target sub-application code includes the business code; The sixth module is used to generate main application configuration information according to the micro application configuration information; The seventh module is used to perform a rapid full build based on the common library configuration information, the target sub-application code and the main application configuration information to obtain the main application and multiple sub-applications.

7. A computer device, characterized in that: include: at least one processor; at least one memory for storing at least one program; When the at least one program is executed by the at least one processor, the at least one processor implements the method according to any one of claims 1 to 5.

8. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the method according to any one of claims 1 to 5 is implemented.

Citation Information

Patent Citations

  • MDF-based micro-front-end resource sharing method and system, and storage medium

    CN117149301A

  • Multi-project shared dependency package packaging method and device, electronic equipment and storage medium

    CN118377524A