A component splitting, interfacing and loading processing method and device for application project

Abstract

The application relates to a component splitting, docking and loading processing method and device of an application project, wherein the component splitting processing method of the application project comprises the following steps: generating a configuration file of a target project component based on an application project, wherein the target project component is a component needing to be split from an original project, and the configuration file at least comprises a target project component identifier; providing the application project code and the configuration file to a packaging tool to generate a target component library through the packaging tool, wherein the target component library comprises a target project component file and an associated project component file having a dependency relationship with the target project component; generating an entry file of the target component library based on the configuration file; packaging the target component library based on the entry file and generating a version file; and registering the packaged target project component library into a source warehouse accessible by the original project. The embodiment of the application simplifies a processing procedure, and reduces cost and risk.

Description

Technical Field

[0001] The present invention relates to the technical field of application development, and in particular to a method and device for component splitting, docking and loading processing of an application project. Background Art

[0002] In the field of application development, it is usually necessary to create a main project corresponding to the application, and then establish various sub-projects within the main project based on the functions to be implemented by the application, with various associations between the sub-projects. As requirements increase and improve, it is necessary to add corresponding projects to the application project or optimize the original related projects and iterate the original project. After multiple iterations, the application project will become a monolithic project. For an application built using a component library, the application project contains various components. For a monolithic project, the coupling between its components is high and complex. When adding new functions or improving existing functions, only the project components involved need to be optimized. In order to improve or optimize the relevant project components, it is usually necessary to split the corresponding project components from the original project and optimize them based on the split project components. The existing general splitting method is to redevelop the component to be split to generate a replacement component, that is, rewrite the code for the function of the component to be split to obtain a new component, and then configure the parameters and release environment of the replacement component. After development is completed, the original component is deleted and the replacement component is docked into the original project. This project splitting method has the following problems: First, since replacement components need to be redeveloped, it is time-consuming, labor-intensive and repetitive. Second, since the coupling between components in the original project is high and complex, it is very difficult to clarify the dependencies between components. Therefore, it is easy to make mistakes when deleting original components and connecting new replacement components, which can easily cause adverse potential impacts on other components with dependencies, thereby affecting application functions and posing a high risk. Third, the disassembled components not only need to configure themselves, but also establish relationships with the original project and other components within it. After testing is completed, they must be released independently, making the process cumbersome. In addition, when the optimization is completed, not only the replacement component itself needs to be tested, but the entire application also needs to be regression tested, which takes a long time and is costly. Summary of the Invention

[0003] In response to the technical problems existing in the prior art, the present invention proposes a method and device for component splitting, docking and loading processing of application projects, which can effectively strip the original project components, simplify the processing process, and reduce costs and risks.

[0004] In order to solve the above technical problem, according to one aspect of the present invention, the present invention provides a component splitting processing method for an application project, comprising the following steps:

[0005] Generate a configuration file of a target project component based on the application project, wherein the target project component is a component that needs to be separated from the original project, and the configuration file at least includes an identifier of the target project component;

[0006] Providing the application project code and the configuration file to a packaging tool, and generating a target component library through the packaging tool, wherein the target component library includes target project component files and associated project component files having a dependency relationship with the target project components;

[0007] Generate an entry file of the target component library based on the configuration file;

[0008] Packaging the target component library based on the entry file and generating a version file; and

[0009] Register the packaged target project component library in the source repository accessible to the original project.

[0010] Preferably, the number of the target project components is one or more.

[0011] Preferably, when there are multiple target project components, a respective configuration file and a respective target component library are generated for each target project component.

[0012] Preferably, when there are multiple target project components, based on the business attributes of the target project components, a configuration file is generated for the target project components with the same business attributes, and a corresponding target component library is generated.

[0013] Preferably, the step of generating a target component library by a packaging tool includes:

[0014] The packaging tool analyzes the dependency relationships of all project components of the original project based on the target project component identifier in the configuration file, and determines the associated project components that have dependency relationships with the target project component.

[0015] The packaging tool references the component code file names of the target project components and the associated project components in the original project to form a project component directory; and

[0016] The packaging tool obtains the project component code files according to the project component directory and compiles them into standard component files for release; among them, the compiled standard component files constitute the target component library.

[0017] Preferably, the step of generating an entry file of the target component library based on the configuration file includes:

[0018] Configure the common content of the entry file template;

[0019] Traverse the configuration file corresponding to the target component library and obtain the target project component identifier therefrom; and

[0020] The target project component identifier is added to the entry file template to obtain the entry file of the target component library.

[0021] According to another aspect of the present invention, the present invention further provides a component docking processing method for an application project, which is used to dock the application project with the components split according to the above method, including the following steps:

[0022] Build a loader in the form of an npm package and register it in the source repository;

[0023] generating an export file for the loader capable of loading a target project component;

[0024] Add a reference to the loader in the external dependency package configuration file of the application project; and

[0025] In the original project, modify the reference to the target project component to a reference to the component in the component library.

[0026] Preferably, the step of generating an export file capable of loading a target project component for the loader comprises:

[0027] Configure the common content of export document templates;

[0028] Traversing the configuration files of the target project components corresponding to the target component library, and obtaining the target project component identifier therefrom; and

[0029] The target project component identifier is added to the export file corresponding to the target component library in the export file template.

[0030] According to another aspect of the present invention, the present invention further provides a component loading processing method for an application project, wherein the application project undergoes the aforementioned component docking processing, and the loading processing method comprises the following steps:

[0031] When a reference to a target project component during the running of the application project is a reference to a component in a component library in a source repository, the loader is started based on a reference to the loader in an external dependency package configuration file;

[0032] Determining whether the loader has the ability to load the target project component based on the target project component identifier of the request;

[0033] In response to the loader having the ability to load the target project component, determining whether the target project component exists in a cache resource based on the request;

[0034] In response to the target project component existing in the cache resource, returning the target project component to the application project; and

[0035] In response to the target project component not being present in the cache resource, the target project component is pulled from the target component library of the source warehouse, and the target project component is returned to the application project.

[0036] Preferably, the step of determining whether the loader has the ability to load the target project component further comprises:

[0037] querying the export file based on the target project component identification of the request;

[0038] Determining whether the export file contains the target project component identifier;

[0039] In response to the target project component identifier being included in the export file, it is determined that the system has the ability to load the target project component.

[0040] Preferably, after the target project component is pulled from the target component library of the source warehouse and returned to the application project, the target project component is registered globally.

[0041] Preferably, during the operation of the application project, when a reference to a target project component is a reference to a component in a component library, a Promise object is returned to the original project, and the target project component is requested by the loader in an asynchronous process; correspondingly, when the target project component is returned to the application project, the target project component is returned to the original project through the Promise.resolve method.

[0042] Preferably, the step of pulling the target project component from the target component library of the source warehouse includes:

[0043] Get the version file of the target project component based on the identifier of the target project component in the reference;

[0044] Based on the target project component library in the reference and determine the corresponding component library version;

[0045] Concatenate the target project component library ID and component library version in the reference as the resource ID;

[0046] Generate a script element, and add the resource identifier and source warehouse address to the script element attributes; and

[0047] Based on the resource identifier and the source warehouse address in the script element attribute, the target project component corresponding to the resource identifier is obtained from the source warehouse.

[0048] According to another aspect of the present invention, the present invention further provides a component decomposition processing device for an application project, comprising:

[0049] a configuration file generating module configured to generate a configuration file of a target project component based on the application project, wherein the target project component is a component that needs to be separated from the original project, and the configuration file at least includes an identifier of the target project component;

[0050] a component library determination module configured to provide the application project code and the configuration file to a packaging tool, and generate a target component library through the packaging tool, wherein the target component library includes target project component files and associated project component files having a dependency relationship with the target project components;

[0051] An entry file generating module, configured to generate an entry file of a target component library based on the configuration file;

[0052] a packaging module configured to package the target component library based on the entry file and generate a version file; and

[0053] The registration module is configured to register the packaged target component library into a source repository accessible to the original project.

[0054] According to another aspect of the present invention, the present invention further provides a component docking processing device for an application project, comprising:

[0055] The loader building module is configured to build a loader in the form of an npm package and register it in the source repository;

[0056] an export file generating module configured to generate an export file capable of loading a target project component for the loader; and

[0057] The reference modification module is configured to add a reference to the loader in the external dependency package configuration file of the application project; and modify the reference to the target project component in the original project to a reference to the component in the component library in the source warehouse.

[0058] According to another aspect of the present invention, the present invention further provides a component loading processing device for an application project, the loading processing device comprising:

[0059] a request module configured to, during the running process of the application project, when a reference to a target project component is a reference to a component in a component library, start the loader based on a reference to the loader in an external dependency package configuration file;

[0060] a checking module configured to determine whether the loader has the ability to load the target project component based on the target project component identifier; and

[0061] The loading module is configured to return the target project component to the application project in response to the loader having the ability to load the target project component and in response to the target project component existing in the cache resource; and to pull the target project component from the target component library of the source warehouse and return the target project component to the application project in response to the target project component not existing in the cache resource.

[0062] According to another aspect of the present invention, the present invention also provides an electronic device, which includes a processor and a memory, and a computer program instruction set is stored on the memory. When the processor executes the computer program instruction set on the memory, it implements the component splitting processing method of the aforementioned application project, or implements the component docking processing method of the aforementioned application project, or implements the component loading processing method of the aforementioned application project.

[0063] According to another aspect of the present invention, the present invention also provides a computer-readable storage medium, wherein a computer program instruction set is stored on the computer-readable storage medium, and when the computer program instruction set is executed by the processor, it implements the component splitting processing method of the aforementioned application project, or implements the component docking processing method of the aforementioned application project, or implements the component loading processing method of the aforementioned application project.

[0064] According to another aspect of the present invention, the present invention also provides a computer program product, which includes a computer program instruction set, and when the computer program instruction set is executed by a processor, it implements the component splitting processing method of the aforementioned application project, or implements the component docking processing method of the aforementioned application project, or implements the component loading processing method of the aforementioned application project.

[0065] The embodiment of the present invention can achieve effective stripping of original project components, simplify the processing process, and reduce costs and risks. BRIEF DESCRIPTION OF THE DRAWINGS

[0066] Below, the preferred embodiments of the present invention will be further described in detail with reference to the accompanying drawings, in which:

[0067] Figure 1 is a flow chart of a component decomposition method for an application project according to an embodiment of the present invention;

[0068] Figure 2 is a flow chart of a component docking processing method for an application project according to an embodiment of the present invention;

[0069] Figure 3 is a flow chart of a component loading processing method for an application project according to an embodiment of the present invention;

[0070] Figure 4This is a principle block diagram of a component splitting processing device for an application project according to an embodiment of the present invention;

[0071] Figure 5 This is a principle block diagram of a component docking processing device for an application project according to one embodiment of the present invention;

[0072] Figure 6 This is a principle block diagram of a component loading processing device for an application project according to an embodiment of the present invention;

[0073] Figure 7 is a functional block diagram of a complete application project processing system according to one embodiment of the present invention; and

[0074] Figure 8 FIG. 1 is a schematic diagram of the hardware structure principle of an electronic device according to an embodiment of the present invention. DETAILED DESCRIPTION

[0075] To make the objectives, technical solutions, and advantages of the embodiments of the present invention more clear, the technical solutions in the embodiments of the present invention will be clearly and completely described below in conjunction with the accompanying drawings in the embodiments of the present invention. Obviously, the described embodiments are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without making creative efforts shall fall within the scope of protection of the present invention.

[0076] In the detailed description that follows, reference may be made to the various drawings that form part of this application and illustrate specific embodiments of the present application. In the drawings, similar reference numerals describe substantially similar components in different figures. Each specific embodiment of the present application is described below in sufficient detail to enable a person of ordinary skill in the art to implement the technical solutions of the present application. It should be understood that other embodiments may be utilized or that structural, logical, or electrical changes may be made to the embodiments of the present application.

[0077] The present invention provides an application development technology, which, in order to facilitate subsequent optimization and improvement of existing application projects, splits components corresponding to one or more sub-projects from the original project as needed.

[0078] See also Figure 1 , Figure 1 1 is a flow chart of a component splitting method for an application project according to an embodiment of the present invention, wherein the splitting method comprises the following steps:

[0079] Step S11 generates a configuration file for a target project component. The target project component is one or more project components in the original project determined based on optimization needs, such as project component A, project component B, and project component C, each corresponding to a function. The configuration file includes the target project component identifier and other configuration parameters, such as domain name configuration parameters, proxy configuration parameters, and component configuration parameters.

[0080] Step S12: providing the application project code and the configuration file to a packaging tool, and generating a target component library through the packaging tool, wherein the target component library includes target project component files and associated project component files having a dependency relationship with the target project components.

[0081] Step S13: Generate an entry file of the target component library based on the configuration file.

[0082] Step S14: Packaging the target component library based on the entry file and generating a version file.

[0083] Step S15: register the packaged target project component library in a source repository accessible to the original project.

[0084] Among them, in step S11, if there are multiple project components, a configuration file can be generated for multiple project components, thereby generating a target component library in the subsequent processing. However, in order to avoid generating another monolith project, a respective configuration file can also be generated for each target project component, thereby generating a respective target component library in the subsequent processing. In addition, a configuration file can also be generated for multiple target project components with the same business attributes, thereby generating a target component library in the subsequent processing. In this embodiment, since project component A and project component B have the same business attributes, a first configuration file is generated for project component A and project component B, and a second configuration file is generated for project component C. The "first" and "second" here are only used to distinguish two files with the same name, and do not represent sorting. Among them, these two configuration files are stored in the configuration folder.

[0085] In step S12, the packaging tool is, for example, webpack. After the application project code and the configuration file are provided to webpack, webpack analyzes the dependencies of all project components of the original project based on the target project component identifier in the configuration file, and determines the associated project components that have dependencies on the target project component. For example, the associated project components of project component A are components D and E; the associated project components of project component B are components D, F, and G; and the associated project components of project component C are components H and I. Webpack then references the component code file names of the target project component and the associated project components in the original project to form a project component directory.

[0086] For project components A and B, the project component directories are as follows:

[0087] Folder 1 / Component D

[0088] Folder 2 / Component E, Component F

[0089] Folder 3 / Component G

[0090] Component files / project component A, project component B

[0091] For project component C, the project component directory is as follows:

[0092] Folder 2 / Component H

[0093] Folder 3 / Component I

[0094] Component File / Project Component C

[0095] The capital letters are component names, and the slashes indicate directory levels.

[0096] webpack obtains the project component code files according to the project component directory and compiles them into standard component files for release; the compiled standard component files constitute the target component library.

[0097] Therefore, for project component A and project component B, a first target component library is generated, such as named as the first business component library, and for project component C, a second target component library is generated, such as named as the second business component library.

[0098] In step S13, in one embodiment, an entry file can be manually generated for each target component library by a developer. In another embodiment, an entry file can be generated for each target component library by means of a template. This embodiment utilizes an entry file template (such as json-templater) to generate the entry file of each target component library. In one embodiment, the entry file template includes three contents: "component library version information", "component content" and "global registration capability". Among them, for multiple target component libraries obtained from the same original project, "component library version information" and "global registration capability" are the common contents of the entry file. All entry files have the same two contents and can be reused. Only "component content" is different. Therefore, before generating the entry file, the "component library version information" and "global registration capability" of the entry file template are manually set. Then, the template function of json-templater and the capabilities of modules such as fs in nodeJS are used to traverse the configuration files in the configuration folder, obtain the target project component identifier, use the target project component identifier as the "component content" of the entry file, and fill it into the entry file template, thereby obtaining the entry file of each target component library. For example, in order to generate the first entry file of the first business component library, determine the corresponding first configuration file from the configuration folder, read the identifiers of project component A and project component B from the first configuration file, and add their identifiers to the "component content" of the entry file, such as "Import A; Import B;" to obtain the entry file of the first business component library, for example, named "First Business Component Library-Entry File".

[0099] In step S14, based on the entry file, the webpack packages each target component library. After packaging is completed, a version file is generated for each target component library. For example, the version field content in the component files in each target component library is integrated together and stored in a Ver.json file, i.e., a version file. The version file is used to connect to the version control of the loader and to address the browser's caching problem.

[0100] In step S15, the packaged target component library is registered in a source repository accessible to the original project.

[0101] The embodiment of the present invention splits the target project component from the application project and registers it as a third party in a source warehouse accessible to the original project. There is no need to redevelop the target project component, saving time and effort. The split component library references the component files in the corresponding directory of the original project, and there is no need to adjust the file directory.

[0102] The present invention also provides a component docking processing method for an application project, which is used to dock the original project with the components split according to the above method, see Figure 2 , Figure 2 The present invention is a flowchart of a component docking processing method for an application project according to an embodiment of the present invention.

[0103] Step S21: Build a loader in the form of an npm package and register it in the source repository.

[0104] Step S22: generating an export file for the loader that can load the target project component.

[0105] Step S23: Add a reference to the loader in the external dependency package configuration file of the application project.

[0106] Step S24: Modify the reference to the target project component in the original project to a reference to the component in the component library.

[0107] Since the present invention splits the project components and publishes them in the source warehouse, in order to enable the original application project to access the split components, the embodiment of the present invention constructs a loading tool, i.e., a loader, in step S21. The loader is registered in the form of an npm package in the source warehouse (or package platform) accessible to the original application project. The source address of the source warehouse is configured by adding @xxx in the .npmrc file. When the loader package needs to be pulled, the source warehouse accessed through the source address pulls the loader package. The loader has the capabilities of naming isolation, asynchronous loading, and version control.

[0108] In step S22, when generating an export file for the loader that can load the target project component, it can be generated manually or by a template as in the aforementioned method for generating the import file. For example, configure the common content of the export file template; traverse the configuration file corresponding to the target component library to obtain the target project component identifier therefrom; and add the target project component identifier to the export file corresponding to the target component library in the export file template. Corresponding to the aforementioned embodiment, the loader can load components from two component libraries: a first business component library and a second business component library, respectively. The first business component library corresponds to the first export file, and the second business component library corresponds to the second export file. The first export file records "export A; export B", and the second export file records "export C".

[0109] In application projects, references to components are usually made through static file directories, and the reference rule for static file directories is "Import A from 'folder 1 / component A file'". For example: Import A from "disk d / folder 1 / file 1", which means referencing component A from file 1 in folder 1 on disk d. The present invention modifies the reference rule to reference through the ESM rule, that is, a reference to components in the component library. The ESM rule is "Import A from 'component library 1 / component A'", which means loading component A in component library 1 through package reference. Based on this reference rule, it is necessary to initiate a network request to the npm platform to load component library 1. After successful loading, the component A file in component library 1 is referenced.

[0110] Through the aforementioned docking process, the split components can be connected to the application project. Although the above description is based on the order of steps 21 to S24, it can be known that the docking process can also be implemented in a different order. Developers can flexibly perform the above four steps.

[0111] See also Figure 3 , Figure 3 The present invention is a flowchart of a component loading processing method for an application project according to an embodiment of the present invention. During the operation of the application project, when a reference to a target project component is a reference to a component in a component library, the method includes the following steps:

[0112] Step S31, starting the loader based on the reference to the loader in the external dependency package configuration file;

[0113] Step S32, based on the target project component identifier of the request, determines whether the loader has the ability to load the target project component. If the loader has the ability to load the target project component, execute step S33. If the loader does not have the ability to load the target project component, report an error in step S34, wait for processing, and end the loading processing flow.

[0114] Step S33: determine whether the target project component exists in the cache resource based on the request. If the target project component exists in the cache resource, execute step S35; if the target project component does not exist in the cache resource, execute step S36.

[0115] Step S35: Return the target project component in the cache resource to the application project and end the loading process.

[0116] Step S36: Pull the target project component from the target component library of the source warehouse, return the target project component to the application project, and end the loading process.

[0117] Among them, in step S32, when determining whether the loader has the ability to load the target project component, the export file is queried based on the target project component identifier; it is determined whether the export file contains the target project component identifier; if the export file contains the target project component identifier, it can be determined that the loader has the ability to load the target project component.

[0118] In addition, in step S36, after the target project component is pulled from the target component library of the source warehouse and returned to the application project, the target project component is registered globally. Thus, after the target project component is pulled, it is stored in the cache for the convenience of the next application.

[0119] In addition, further, when a reference to a target project component during the operation of the application project is a reference to a component in the component library in the source repository, a Promise object is returned to the original project, and the target project component is requested from the loader in an asynchronous process; correspondingly, when the target project component is returned to the application project, the target project component is returned to the original project through the Promise.resolve method.

[0120] In step S36, in one embodiment, the target project component is pulled from the target component library of the source warehouse via a script tag. Specifically, the target project component version file is first obtained based on the identifier of the target project component in the reference, and the corresponding component library version data is determined based on the target project component library in the reference; the target project component library identifier and the component library version data in the reference are concatenated together as a resource identifier; a script element is then generated, and the resource identifier and source warehouse address are added to the script element attributes; and based on the resource identifier and source warehouse address in the script element attributes, the target project component corresponding to the resource identifier is obtained from the source warehouse.

[0121] Through the aforementioned method, the components that require special processing in the original application project are integrated and extracted according to certain rules and then registered in the source warehouse. They can be independently versioned and have independent publishing capabilities. When applied, they are dynamically loaded according to the configuration through a unified loader, realizing the decoupling and migration of the project, saving time and effort.

[0122] Among them, when the component code is modified, the debugging scenario is used to check whether the final implementation effect is consistent with the expectation. The debugging process, for example, modifies the component code, then compiles, packages and publishes the new version of the component code file to the package platform, and then the original project requests the latest version of the component at runtime to check the running effect. Since the component files and directories in the split component library in the present invention refer to the original project directory and component files, the path can also be optimized and adjusted to: modify the component, the original project requests the component file, and then check the effect after running. It can be seen that the debugging process steps can still be reduced in the debugging scenario, thereby achieving the purpose of improving debugging efficiency.

[0123] In addition, as mentioned earlier, the component files registered to the package platform (i.e., source repository) when the components are split still use the component files in the original project. Therefore, after the split, Git Modules can be used to update the main application project, thereby ensuring the real-time dependency of the component files.

[0124] In this embodiment of the present invention, the separated project components are component packages in the UMD format. They support pulling component libraries through script tags. The obtained component library content can be registered in the global environment, thus providing caching capabilities. The global environment refers to the code execution environment. The loader can store successfully loaded components in this environment. Subsequent requests for the same components can be directly read from the environment without creating script tags to re-pull from the package platform.

[0125] From the foregoing content, it can be seen that the present invention can customize component content, and realize seamless splitting for the base project of the application; it reuses configuration variables such as the environment during splitting without the need for code migration; it also reuses the server and deployment environment to reduce resource usage, and can realize dynamic and asynchronous loading during loading, thereby improving the loading efficiency of the component.

[0126] See also Figure 4 , Figure 4This is a principle block diagram of a component splitting processing device for an application project according to an embodiment of the present invention. The component splitting processing device 10 for an application project in the embodiment of the present invention includes a configuration file generation module 11, a component library determination module 12, an entry file generation module 13, a packaging module 14, and a registration module 15. The configuration file generation module 11 generates a configuration file for a target project component based on the application project 100, wherein the target project component is a component that needs to be split from the original project, and the configuration file at least includes a target project component identifier. The number of the target project components is one or more. When the number of the target project components is multiple, in one embodiment, a respective configuration file is generated for each target project component so as to generate a respective target component library in subsequent processing; in another embodiment, based on the business attributes of the target project components, a configuration file is generated for the target project components with the same business attributes, and a corresponding target component library is generated based on each business attribute in subsequent processing.

[0127] The component library determination module 12 is configured to provide the code of the application project 100 and the configuration file to a packaging tool, such as webpack, to generate a target component library through the packaging tool, wherein the target component library includes target project component files and associated project component files having dependencies on the target project components.

[0128] The entry file generation module 13 is configured to generate an entry file for the target component library based on the configuration file. In one embodiment, the entry file is generated by the entry file module by configuring the common content of the entry file template; traversing the configuration file corresponding to the target project component library to obtain the target project component identifier therefrom; and adding the target project component identifier to the entry file template to obtain the entry file for the target component library.

[0129] The packaging module 14 is configured to package the target component library based on the entry file and generate a version file. In one embodiment, the packaging module 14 generates the target component library through a packaging tool, for example, including: the packaging tool analyzes the dependency relationship of all project components of the original project based on the target project component identifier in the configuration file, and determines the associated project components that have a dependency relationship with the target project component; the packaging tool references the component code file names of the target project component and the associated project components in the original project to form a project component directory; and the packaging tool obtains the project component code files according to the project component directory and compiles them into standard component files for release; wherein the compiled standard component files constitute the target component library.

[0130] The registration module 15 is configured to register the packaged target component library into a source repository 200 accessible to the original project.

[0131] See also Figure 5 , Figure 5 This is a principle block diagram of a component docking processing device for an application project according to an embodiment of the present invention. The component docking processing device 20 for an application project in the embodiment of the present invention includes a loader construction module 21, an export file generation module 22, and a reference modification module 23, wherein the loader construction module 21 is configured to construct a loader in the form of an npm package and register it with the source warehouse 200; the export file generation module 2 is configured to generate an export file for the loader that can load the target project component; further, the export file generation module 2 configures the common content of the export file template, traverses the configuration file of the target project component corresponding to the target component library, obtains the target project component identifier therefrom, and adds the target project component identifier to the export file corresponding to the target component library in the export file template. The reference modification module 23 is configured to add a reference to the loader in the external dependency package configuration file of the application project 100, and modify the reference to the target project component in the application project 100 to a reference to the component in the component library in the source warehouse.

[0132] See also Figure 6 , Figure 6 3 is a principle block diagram of a component loading processing device for an application project according to an embodiment of the present invention. The component loading processing device 30 for the application project in this embodiment includes a loader module 31, a verification module 32 and a loading module 33. During the operation of the application project, when a reference to a target component is a reference to a component in a component library, the loader module 31 is configured to start the loader based on a reference to the loader in an external dependency package configuration file; the verification module 32 is configured to determine whether the loader has the ability to load the target project component based on a target project component identifier; the loading module 33 returns the target project component to the application project 100 in response to the presence of the target project component in a cache resource when the loader has the ability to load the target project component; and pulls the target project component from the target component library of the source warehouse in response to the absence of the target project component in the cache resource, and returns the target project component to the application project 100.

[0133] See also Figure 7 , Figure 7This is a complete principle block diagram of an application project processing system according to an embodiment of the present invention. The application project processing system 300 in this embodiment includes the aforementioned application project component splitting processing device 10, the application project component docking processing device 20, and the application project component loading processing device 30. The application project component splitting processing device 10 is used to split the project components from the application project 100 and publish them to the source warehouse 200. The application project component docking processing device 20 is used to establish an association between the application project 100 and the split project components. When the split project components are needed during the application process of the application project 100, they are dynamically loaded by the application project component loading processing device 30. Therefore, the method and system provided by the present invention do not need to redevelop the components, saving time and effort, and avoiding the impact on the components with dependencies when accessing the original project. There is no need to re-establish the relationship with the original project and other components, and by optimizing the test, the test time can be reduced and the test efficiency can be improved.

[0134] In another aspect, the present invention further provides an electronic device, see Figure 8 , Figure 8 This is a schematic diagram of the hardware structure principle of an electronic device according to an embodiment of the present invention. The electronic device can be implemented as a server or various other terminal devices, such as a desktop personal computer, a tablet computer, a laptop computer, a mobile phone, etc., and includes a processor 601 and a memory 602. The memory 602 stores a program instruction set. When the processor 601 executes the program instruction set on the memory 602, the component splitting, docking and loading processing methods of the aforementioned application project are implemented.

[0135] Specifically, the processor 601 may include a central processing unit (CPU), or an application specific integrated circuit (ASIC), or may be configured to implement one or more integrated circuits of the embodiment of the present invention.

[0136] The memory 602 may include a large capacity memory for data or instructions. By way of example and not limitation, the memory 602 may include a hard disk drive (HDD), a floppy disk drive, a flash memory, an optical disk, a magneto-optical disk, a magnetic tape, or a universal serial bus (USB) drive, or a combination of two or more of these. Where appropriate, the memory 602 may include removable or non-removable (or fixed) media. Where appropriate, the memory 602 may be inside or outside the integrated gateway disaster recovery device. In a specific embodiment, the memory 602 is a non-volatile solid-state memory.

[0137] The memory may include a read-only memory (ROM), a random access memory (RAM), a magnetic disk storage medium device, an optical storage medium device, a flash memory device, an electrical, optical or other physical / tangible memory storage device. Therefore, generally, the memory includes one or more tangible (non-transitory) computer-readable storage media (e.g., a memory device) encoded with software including computer-executable instructions, and when the software is executed (e.g., by one or more processors), it is operable to perform the component splitting, docking and loading processing method of the application project provided by the present invention.

[0138] In one example, the electronic device may further include a communication interface 603 and a bus 604. The processor 601, the memory 602, and the communication interface 603 are connected via the bus 604 and communicate with each other.

[0139] The communication interface 603 is mainly used to implement communication between various modules, devices, units and / or equipment in the embodiment of the present invention.

[0140] Bus 604 includes hardware, software or both, and the components of online data flow metering equipment are coupled to each other. For example, but not limitation, bus can include accelerated graphics port (AGP) or other graphics bus, enhanced industry standard architecture (EISA) bus, front side bus (FSB), hypertransport (HT) interconnection, industry standard architecture (ISA) bus, infinite bandwidth interconnection, low pin count (LPC) bus, memory bus, micro channel architecture (MCA) bus, peripheral component interconnect (PCI) bus, PCI-Express (PCI-X) bus, serial advanced technology attachment (SATA) bus, video electronics standard association local (VLB) bus or other suitable bus or two or more of these combinations. In appropriate cases, bus 604 can include one or more buses. Although the embodiment of the present invention describes and shows a specific bus, the present invention considers any suitable bus or interconnection.

[0141] The present invention also provides a computer-readable storage medium having computer program instructions stored thereon, which can be executed by a processor to implement the component splitting, docking and loading processing method of any application project in the aforementioned embodiments. The computer-readable storage medium can be any medium that can tangibly contain or store computer-executable instructions for use by or in combination with an instruction execution system, device and equipment. The storage medium can be a transient computer-readable storage medium or a non-transient computer-readable storage medium. Non-transient computer-readable storage media may include but are not limited to magnetic storage devices, optical storage devices and / or semiconductor storage devices. Examples of corresponding storage devices include, for example, magnetic disks, optical disks based on CD, DVD or Blu-ray technology, and persistent solid-state memories such as flash memory, solid-state drives, and the like.

[0142] The present invention also provides a computer program product comprising a set of computer program instructions that, when executed by a processor, implements any of the aforementioned methods for component splitting, docking, and loading an application project. The computer program product includes, but is not limited to, an application installation package published on a website or in an app store, an application plug-in, or a mini-program that can be run within certain applications.

[0143] The above embodiments are only used to illustrate the present invention, and are not intended to limit the present invention. Ordinary technicians in the relevant technical field can make various changes and modifications without departing from the scope of the present invention. Therefore, all equivalent technical solutions should also fall within the scope of the present invention.

Claims

1. A component splitting processing method for an application project, characterized in that: include: Generate a configuration file of a target project component based on the application project, wherein the target project component is a component that needs to be separated from the original project, and the configuration file at least includes an identifier of the target project component; Providing the application project code and the configuration file to a packaging tool, and generating a target component library through the packaging tool, wherein the target component library includes target project component files and associated project component files having a dependency relationship with the target project components; Generate an entry file of the target component library based on the configuration file; Packaging the target component library based on the entry file and generating a version file; as well as Register the packaged target component library in the source repository accessible to the original project.

2. The method according to claim 1, characterized in that The number of the target project components is one or more.

3. The method according to claim 2, characterized in that When there are multiple target project components, a respective configuration file and a respective target component library are generated for each target project component.

4. The method according to claim 2, characterized in that When there are multiple target project components, a configuration file is generated for the target project components with the same business attributes based on the business attributes of the target project components, and a corresponding target component library is generated.

5. The method according to claim 1, wherein The steps to generate the target component library through the packaging tool include: The packaging tool analyzes the dependency relationships of all project components of the original project based on the target project component identifier in the configuration file, and determines the associated project components that have dependency relationships with the target project component. The packaging tool references the component code file names of the target project components and the associated project components in the original project to form a project component directory; and The packaging tool obtains the project component code files according to the project component directory and compiles them into standard component files for release; among them, the compiled standard component files constitute the target component library.

6. The method according to claim 1, characterized in that The steps of generating an entry file of a target component library based on the configuration file include: Configure the common content of the entry file template; Traverse the configuration file corresponding to the target component library and obtain the target project component identifier therefrom; and The target project component identifier is added to the entry file template to obtain the entry file of the target component library.

7. A component docking processing method for an application project, used for docking an original project with components split according to any one of the methods of claims 1-6, characterized in that: include: Build a loader in the form of an npm package and register it in the source repository; generating an export file for the loader capable of loading a target project component; Add a reference to the loader in the external dependency package configuration file of the application project; as well as In the original project, modify the reference to the target project component to a reference to the component in the component library in the source repository.

8. The method according to claim 7, characterized in that The step of generating an export file capable of loading a target project component for the loader comprises: Configure the common content of export document templates; Traverse the configuration files of the target project component and obtain the target project component identifier therefrom; and The target project component identifier is added to the export file template to generate an export file for loading the target project component from the target component library.

9. A component loading processing method for an application project, wherein: The application project undergoes the component docking process of claim 7 or 8, wherein the loading processing method comprises: During the running of the application project, when a reference to a target project component is a reference to a component in a component library in a source repository, the loader is started based on a reference to the loader in an external dependency package configuration file; Determining whether the loader has the ability to load the target project component based on the target project component identifier of the request; In response to the loader having the ability to load the target project component, determining whether the target project component exists in a cache resource based on the request; In response to the target project component existing in the cache resource, returning the target project component to the application project; and In response to the target project component not being present in the cache resource, the target project component is pulled from the target component library of the source warehouse, and the target project component is returned to the application project.

10. The method according to claim 9, characterized in that The step of determining whether the loader has the ability to load the target project component further includes: Query the corresponding export file based on the target project component identifier of the request; Determining whether the export file contains the target project component identifier; In response to the target project component identifier being included in the export file, it is determined that the loader has the ability to load the target project component.

11. The method according to claim 9, characterized in that After pulling the target project component from the target component library of the source warehouse and returning the target project component to the application project, the target project component is registered globally.

12. The method according to any one of claims 9 to 11, characterized in that: During the running process of the application project, when a reference to a target project component is a reference to a component in the component library in the source repository, a Promise object is returned to the original project, and the target project component is requested by the loader in an asynchronous process; correspondingly, when the target project component is returned to the application project, the target project component is returned to the original project through the Promise.resolve method.

13. The method according to claim 9, characterized in that The steps of pulling the target project component from the target component library of the source warehouse include: Get the version file of the target project component based on the identifier of the target project component in the reference; Determine the corresponding component library version data from the version file based on the target component library identifier in the reference; The target project component library identifier and component library version data in the reference are spliced ​​together as the resource identifier; Generate a script element, and add the resource identifier and source warehouse address to the script element attributes; and Based on the resource identifier and the source warehouse address in the script element attribute, the target project component corresponding to the resource identifier is obtained from the source warehouse.

14. A component splitting processing device for an application project, characterized in that: include: a configuration file generating module configured to generate a configuration file of a target project component based on the application project, wherein the target project component is a component that needs to be separated from the original project, and the configuration file at least includes an identifier of the target project component; a component library determination module configured to provide the application project code and the configuration file to a packaging tool, and generate a target component library through the packaging tool, wherein the target component library includes target project component files and associated project component files having a dependency relationship with the target project components; An entry file generating module, configured to generate an entry file of a target component library based on the configuration file; a packaging module, configured to package the target component library based on the entry file and generate a version file; as well as The registration module is configured to register the packaged target component library into the source repository accessible to the original project.

15. A component docking processing device for an application project, used for docking an original project with components split according to any one of the methods of claims 1-6, characterized in that: include: The loader building module is configured to build a loader in the form of an npm package and register it in the source repository; an export file generating module configured to generate an export file capable of loading a target project component for the loader; as well as The reference modification module is configured to add a reference to the loader in the external dependency package configuration file of the application project; and modify the reference to the target project component in the original project to a reference to the component in the component library in the source warehouse.

16. A component loading processing device for an application project, wherein: The application project is subjected to the component docking process of claim 7 or 8, and is characterized by comprising: a request module configured to, during the running process of the application project, when a reference to a target project component is a reference to a component in a component library in a source repository, start the loader based on a reference to the loader in an external dependency package configuration file; a checking module configured to determine whether the loader has the ability to load the target project component based on the target project component identifier; and The loading module is configured to return the target project component to the application project in response to the loader having the ability to load the target project component and in response to the target project component existing in the cache resource; and to pull the target project component from the target component library of the source warehouse and return the target project component to the application project in response to the target project component not existing in the cache resource.

17. An electronic device comprising a processor and a memory, characterized in that: A computer program instruction set is stored on the memory, and when the processor executes the computer program instruction set on the memory, it implements the component splitting processing method of the application project described in any one of claims 1 to 6, or implements the component docking processing method of the application project described in claim 7 or 8, or implements the component loading processing method of the application project described in any one of claims 9 to 13.

18. A computer-readable storage medium, wherein: The computer-readable storage medium stores a computer program instruction set, which, when executed by a processor, implements the component splitting processing method of the application project described in any one of claims 1 to 6, or implements the component docking processing method of the application project described in claim 7 or 8, or implements the component loading processing method of the application project described in any one of claims 9 to 13.

19. A computer program product, comprising a computer program instruction set, which, when executed by a processor, implements the component splitting processing method of the application project described in any one of claims 1 to 6, or implements the component docking processing method of the application project described in claim 7 or 8, or implements the component loading processing method of the application project described in any one of claims 9 to 13.

Images