Integration method and system based on Monorepo architecture

Abstract

The invention discloses an integration method and system based on a Monorepo architecture, and relates to the technical field of front-end development. Based on a Monorepo architecture, the method comprises the following steps: step 1: according to a naming specification and a directory hierarchy, defining a boundary and a relationship of each sub-project, optimizing a single warehouse directory structure, and performing centralized management on all the sub-projects of a front-end project and a public library, step 2: creating an automatic script through a script tool in combination with project characteristics and requirements, according to the method, automatic processing of the whole process of code pulling, dependency analysis, construction packaging and deployment online is carried out through an automatic script, automatic script packaging is carried out through a version control system Git, an automatic version updating and synchronization mechanism is designed, it is ensured that each sub-project uses a correct branch and version, and change detailed information is recorded; 3, deployment of the front-end project is controlled through a visual construction engine, various functions of project management are integrated, the various functions of project management comprise version management, dependency analysis, construction configuration, deployment monitoring and dragging and clicking operation, and the current state, the dependency relationship and the change history of each sub-project are visually displayed.

Description

Technical Field

[0001] The present invention discloses an integration method and system based on Monorepo architecture, and relates to the technical field of front-end development. Background Art

[0002] With the continuous development of front-end technology, project development has gradually shifted to a front-end and back-end separation mode, allowing front-end development to focus more on the presentation and interaction of the user interface. Different projects or teams use different front-end build tools, such as Webpack, Rollup, and Parcel. These tools have significant differences in configuration and use, and may rely on different versions of Node.js or other dependent packages. When multiple projects are used at the same time, version conflicts often lead to build failures, which in turn affects development progress and team collaboration. In addition, the current mainstream page development mode is mostly single-page application (SPA). This method usually disperses the code of different projects and modules in multiple repositories. Although this dispersion can improve the flexibility of modularization, it also significantly increases the complexity of code management. This not only makes it difficult to reuse code, but also requires developers to invest more time and energy to understand and familiarize themselves with the code structure of different projects, affecting work efficiency. And when managing dependencies in multiple repositories, version inconsistency and dependency conflicts are prone to occur, which not only increases the complexity of building and deployment, but also may cause runtime errors, affect the stability and reliability of the application, and have a negative impact on user experience. Summary of the invention

[0003] In view of the problems of the prior art, the present invention provides an integration method and system based on the Monorepo architecture, which effectively solves the problems existing in large-scale front-end projects by optimizing the directory structure, realizing engineering automation and visual global control, improves development efficiency and project controllability, optimizes user experience, supports customized services, and has significant technical effects and broad application prospects.

[0004] The specific scheme proposed by the present invention is:

[0005] The present invention provides an integration method based on the Monorepo architecture, which includes:

[0006] Step 1: According to the naming conventions and directory hierarchy, clarify the boundaries and relationships of each sub-project, optimize the directory structure of the single repository, and centrally manage all sub-projects and public libraries of the front-end project.

[0007] Step 2: Create an automated script through a scripting tool based on the project characteristics and requirements. Use the automated script to automate the entire process of code pulling, dependency parsing, building packaging, and deployment. Use the version control system Git to encapsulate the automated script and design an automated version update and synchronization mechanism to ensure that each subproject uses the correct branch and version, and record the change details.

[0008] Step 3: Control the deployment of front-end projects through a visual build engine, integrating various project management functions, including version management, dependency analysis, build configuration, and deployment monitoring. Through drag-and-drop and click operations, the current status, dependencies, and change history of each sub-project are intuitively displayed.

[0009] Furthermore, in step 1 of the integration method based on the Monorepo architecture, a branch storage is created in the public library for each sub-project, and the branch is named in the case_xx format. When a scenario development is completed and merged into the main branch, a tag is created to mark this version. The tag will contain the version number, release date and related description information of the version, so that the sub-project can be introduced and used through the version number, and the scenario development package can be synchronized to the lib directory of the monorepo, so that the sub-project can be called directly by local introduction.

[0010] Furthermore, in step 1 of the integration method based on the Monorepo architecture, the one-way dependency relationship of the sub-project is clarified, and the sub-project is regarded as a component, so that the sub-project only contains the package.json file to identify the dependencies used in the project, and the nodemodules folder is no longer created repeatedly. With the help of the pnpm construction tool library, performance is optimized and disk usage is reduced through hard links and content addressing.

[0011] Furthermore, in step 2 of the Monorepo architecture-based integration method, the Monorepo architecture is used to manage project codes to achieve consistency in style and interaction, and uniformity in code specifications, and SubModule is used to manage sub-project codes to achieve multi-version management of sub-projects; at the same time, sub-projects are managed by reference through SubModule.

[0012] Furthermore, in step 3 of the Monorepo architecture-based integration method, the visualization construction engine is initialized, including:

[0013] Generate the visual build engine's own global variables,

[0014] Initialize the visual build engine's own operating environment,

[0015] Initialize the local static site server.

[0016] Furthermore, in step 3 of the integration method based on the Monorepo architecture, a tree structure is constructed using a visual construction engine, and the files of the sub-projects are traversed through the tree structure for visual display, wherein a tree structure of dependency library dependencies is generated by using a visual construction engine, and the package.json file is traversed according to the tree structure of dependency library dependencies, the used dependency library is read, and then the breadth-first algorithm of the graph is used to analyze the relationship between parent-child projects and sub-projects starting from the root directory; a tree structure of the project name is constructed by using visualization, and the monolithic warehouse directory is traversed according to the tree structure of the project name, and all sub-project names, branch names of SubModules and description information under the branches corresponding to the sub-project names under the current project are listed.

[0017] The present invention also provides an integrated system based on the Monorepo architecture, which includes a warehouse management module, a script management module and a deployment management module.

[0018] The warehouse management module clarifies the boundaries and relationships of each sub-project according to the naming conventions and directory hierarchy, optimizes the directory structure of the single warehouse, and centrally manages all sub-projects and public libraries of the front-end project.

[0019] The script management module creates automated scripts through script tools based on project characteristics and requirements. The automated scripts automate the entire process of code pulling, dependency parsing, building packaging, and deployment online. The automated scripts are packaged through the version control system Git, and an automated version update and synchronization mechanism is designed to ensure that each sub-project uses the correct branch and version, and record change details.

[0020] The deployment management module controls the deployment of front-end projects through a visual build engine, integrating various project management functions including version management, dependency analysis, build configuration, and deployment monitoring. It can be operated by dragging and clicking, and intuitively displays the current status, dependencies, and change history of each sub-project.

[0021] The present invention also provides an integrated device based on the Monorepo architecture, comprising: at least one memory and at least one processor;

[0022] The at least one memory is used to store a machine-readable program;

[0023] The at least one processor is used to call the machine-readable program to execute the integration method based on the Monorepo architecture.

[0024] The benefits of the method of the present invention are:

[0025] 1. Improve development and management efficiency: Through automated scripts and visual build engines, simplify project management processes, reduce manual operations, and improve development efficiency.

[0026] 2. Directory structure optimization: Based on the single warehouse model, the project directory structure is reconstructed to ensure that each sub-application exists as an independent package for easy management and maintenance.

[0027] 3. Customized script development: According to the project characteristics and requirements, develop a set of customized script tools to realize the automation of the whole process including code pulling, dependency parsing, building packaging, and deployment online.

[0028] 4. Visual build engine development: Develop a graphical visual build engine that integrates various project management functions, provides an intuitive operation interface and customized build system functions. BRIEF DESCRIPTION OF THE DRAWINGS

[0029] Figure 1 It is a schematic diagram of the application framework of the method of the present invention.

[0030] Figure 2 This is a schematic diagram of the project warehouse.

[0031] Figure 3 It is a diagram of the shared library deployment of the project.

[0032] Figure 4 It is a schematic diagram of the visual build engine application.

[0033] Figure 5 It is a tree structure diagram. DETAILED DESCRIPTION

[0034] The present invention is further described below in conjunction with the accompanying drawings and specific embodiments so that those skilled in the art can better understand the present invention and implement it, but the embodiments are not intended to limit the present invention.

[0035] Example 1

[0036] The present invention provides an integration method based on the Monorepo architecture, which includes:

[0037] Step 1: According to the naming conventions and directory hierarchy, clarify the boundaries and relationships of each sub-project, optimize the directory structure of the single repository, and centrally manage all sub-projects and public libraries of the front-end project.

[0038] The Share Library is a repository that independently stores common tool classes and common components. It is used to improve code reusability, reduce code complexity, and maintain consistency of UI interface and interactive behavior. In ShareLibrary, in order to cope with customized development needs, the scenario branch management strategy is adopted. With the help of the SubModule function of Git code management, every time a new scenario requirement is mentioned, a new branch will be created in the shared library and named in the case_xx format. It can ensure that each scenario has its own life cycle and version control. In order to ensure the stability and maintainability of the shared library, every time a feature scenario is developed and merged into the main branch, a tag will be created to mark this version. This tag will contain the version number, release date, and related description information of the version. Subprojects are introduced and used through version numbers. New development packages can be uploaded to the company's internal shared server for subprojects to download and use. At the same time, in order to maintain the synchronization of the single warehouse, the new development package can also be synchronized to the lib directory of the single warehouse. In this way, subprojects can be directly called and built and packaged by local introduction.

[0039] To avoid repeated downloading of dependent libraries, a one-way dependency relationship is built. The subproject is regarded as a component, and the subproject only contains the package.json file to identify the dependencies used in the project. The nodemodules folder is no longer created repeatedly. With the ability of pnpm to build tool libraries, performance is optimized and disk usage is reduced through hard links and content addressing.

[0040] Step 2: Create automation scripts through scripting tools based on project characteristics and requirements. Use automation scripts to automate the entire process of code pulling, dependency parsing, building packaging, and deployment. Encapsulate automation scripts through the version control system Git, and design an automated version update and synchronization mechanism to ensure that each sub-project uses the correct branch and version, and record change details.

[0041] Through script analysis, sub-applications and their feature branches are visualized, the build process is automated, and the Monorepo architecture is used to manage project code to achieve consistency in style and interaction, and uniformity in code standards. SubModule is used to manage sub-project code to achieve multi-version management of sub-projects; at the same time, sub-projects are managed by reference through SubModule.

[0042] Step 3: Control the deployment of front-end projects through a visual build engine, integrating various project management functions, including version management, dependency analysis, build configuration, and deployment monitoring. Through drag-and-drop and click operations, the current status, dependencies, and change history of each sub-project are intuitively displayed.

[0043] In step 3, the visualization construction engine is initialized, including:

[0044] Generate the visual build engine's own global variables,

[0045] Initialize the visual build engine's own operating environment,

[0046] Initialize the local static site server.

[0047] The initialization script first reads the config.js file in the root directory, loads the configuration information into memory, and then initializes the three-party dependency libraries in turn; next, it generates a unique identifier for the build record, uses the sub-project name and the history of the last Git commit record as the hashKey, and uses the re-hashing algorithm to generate a unique identifier for the build version record. After all modules are generated, they are stored in global variables and stored in local files for persistent storage. After waiting for the first two steps of initialization to be completed, the engine script traverses the changelog files, package.json files, and readme files used by sub-projects to describe specific functions in the root directory and sub-projects, loads the file contents into memory, and then layouts them according to the html syntax format, visualizes the text content, and visualizes the execution scripts under package.json. After the above file contents are drawn and laid out in memory, an HTML file will be generated. There are no constraints on the style layout of HTML, and only the functionality is defined. After the HTML file is generated, it will be placed in the cache directory. After the static resource server is started, a URL link will be generated, which users can access through a browser. Its functions include executing script buttons, changelog log information, dependency tree structure, and version information of each sub-project and specific readme information.

[0048] You can also use the visual build engine to build a tree structure, traverse the files of the sub-project through the tree structure, and display it visually. The visual build engine generates a tree structure of dependency libraries, traverses the package.json file according to the tree structure of dependency libraries, reads the dependency libraries used, and then uses the breadth-first algorithm of the graph to analyze the relationship between parent-child projects and sub-projects starting from the root directory. The tree structure of the project name is constructed visually, and the single repository directory is traversed according to the tree structure of the project name to list all sub-project names, branch names of SubModules, and description information under the branches corresponding to the sub-project names under the current project.

[0049] Example 2

[0050] The present invention also provides an integrated system based on the Monorepo architecture, which includes a warehouse management module, a script management module and a deployment management module.

[0051] The warehouse management module clarifies the boundaries and relationships of each sub-project according to the naming conventions and directory hierarchy, optimizes the directory structure of the single warehouse, and centrally manages all sub-projects and public libraries of the front-end project.

[0052] The script management module creates automated scripts through script tools based on project characteristics and requirements. The automated scripts automate the entire process of code pulling, dependency parsing, building packaging, and deployment online. The automated scripts are packaged through the version control system Git, and an automated version update and synchronization mechanism is designed to ensure that each sub-project uses the correct branch and version, and record change details.

[0053] The deployment management module controls the deployment of front-end projects through a visual build engine, integrating various project management functions including version management, dependency analysis, build configuration, and deployment monitoring. It can be operated by dragging and clicking, and intuitively displays the current status, dependencies, and change history of each sub-project.

[0054] As the information interaction and execution process between the modules in the above-mentioned system are based on the same concept as the embodiment of the method of the present invention, the specific contents can be found in the description of the embodiment of the method of the present invention and will not be repeated here.

[0055] Likewise, the benefits of the system of the present invention are:

[0056] 1. Improve development and management efficiency: Through automated scripts and visual build engines, simplify project management processes, reduce manual operations, and improve development efficiency.

[0057] 2. Directory structure optimization: Based on the single warehouse model, the project directory structure is reconstructed to ensure that each sub-application exists as an independent package for easy management and maintenance.

[0058] 3. Customized script development: According to the project characteristics and requirements, develop a set of customized script tools to realize the automation of the whole process including code pulling, dependency parsing, building packaging, and deployment online.

[0059] 4. Visual build engine development: Develop a graphical visual build engine that integrates various project management functions, provides an intuitive operation interface and customized build system functions.

[0060] It should be noted that not all steps and modules in the above-mentioned processes and system structures are necessary, and some steps or modules can be ignored according to actual needs. The execution order of each step is not fixed and can be adjusted as needed. The system structure described in the above-mentioned embodiments can be a physical structure or a logical structure, that is, some modules may be implemented by the same physical entity, or some modules may be implemented by multiple physical entities, or some components in multiple independent devices may be implemented together.

[0061] Example 3

[0062] The present invention also provides an integrated device based on the Monorepo architecture, comprising: at least one memory and at least one processor;

[0063] The at least one memory is used to store a machine-readable program;

[0064] The at least one processor is used to call the machine-readable program to execute the integration method based on the Monorepo architecture.

[0065] As the information interaction, execution of readable program process and other contents of the processor in the above-mentioned device are based on the same concept as the embodiment of the method of the present invention, the specific contents can be found in the description of the embodiment of the method of the present invention and will not be repeated here.

[0066] Likewise, the benefits of the device of the present invention are:

[0067] 1. Improve development and management efficiency: Through automated scripts and visual build engines, simplify project management processes, reduce manual operations, and improve development efficiency.

[0068] 2. Directory structure optimization: Based on the single warehouse model, the project directory structure is reconstructed to ensure that each sub-application exists as an independent package for easy management and maintenance.

[0069] 3. Customized script development: According to the project characteristics and requirements, develop a set of customized script tools to realize the automation of the whole process including code pulling, dependency parsing, building packaging, and deployment online.

[0070] 4. Visual build engine development: Develop a graphical visual build engine that integrates various project management functions, provides an intuitive operation interface and customized build system functions.

[0071] The above-described embodiments are only preferred embodiments for fully illustrating the present invention, and the protection scope of the present invention is not limited thereto. Equivalent substitutions or changes made by those skilled in the art based on the present invention are within the protection scope of the present invention. The protection scope of the present invention shall be subject to the claims.

Claims

1. An integration method based on Monorepo architecture, characterized by Based on Monorepo architecture, including: Step 1: According to the naming conventions and directory hierarchy, clarify the boundaries and relationships of each sub-project, optimize the directory structure of the single repository, and centrally manage all sub-projects and public libraries of the front-end project. Step 2: Create an automated script through a scripting tool based on the project characteristics and requirements. Use the automated script to automate the entire process of code pulling, dependency parsing, building packaging, and deployment. Use the version control system Git to encapsulate the automated script and design an automated version update and synchronization mechanism to ensure that each subproject uses the correct branch and version, and record the change details. Step 3: Control the deployment of front-end projects through a visual build engine, integrating various project management functions, including version management, dependency analysis, build configuration, and deployment monitoring. Through drag-and-drop and click operations, the current status, dependencies, and change history of each sub-project are intuitively displayed.

2. The integration method based on Monorepo architecture according to claim 1, characterized in that In step 1, create a branch storage for each sub-project in the public library and name the branch in the case_xx format. When a scenario is developed and merged into the main branch, create a tag to mark the version. The tag will contain the version number, release date, and related description information, so that the sub-project can be introduced and used through the version number, and the scenario development package is synchronized to the lib directory of the single repository, so that the sub-project can be called directly by local introduction.

3. The integration method based on Monorepo architecture according to claim 2, characterized in that In step 1, the one-way dependency relationship of the sub-project is also clarified. The sub-project is regarded as a component, so that the sub-project only contains the package.json file to identify the dependencies used in the project. The nodemodules folder is no longer created repeatedly. The pnpm build tool library is used to optimize performance and reduce disk usage through hard links and content addressing.

4. The integration method based on Monorepo architecture according to claim 1, characterized in that In step 2, the Monorepo architecture is used to manage project codes to achieve consistency in style and interaction, and uniformity in code standards. SubModule is used to manage sub-project codes to achieve multi-version management of sub-projects. At the same time, sub-projects are managed by reference through SubModule.

5. The integration method based on Monorepo architecture according to claim 1, characterized in that In step 3, the visual build engine is initialized, including: Generate the visual build engine's own global variables, Initialize the visual build engine's own operating environment, Initialize the local static site server.

6. The integration method based on Monorepo architecture according to claim 1, characterized in that In step 3, a tree structure is constructed using a visual build engine, and the files of the sub-projects are traversed through the tree structure for visual display. A tree structure of dependency libraries is generated by using a visual build engine, and the package.json file is traversed according to the tree structure of dependency libraries to read the dependency libraries used. Then, the breadth-first algorithm of the graph is used to analyze the relationship between parent-child projects and sub-projects starting from the root directory. By using visualization to build a tree structure of the project name, traverse the single repository directory according to the tree structure of the project name, and list all sub-project names, branch names of SubModules, and description information under the branches corresponding to the sub-project names under the current project.

7. An integrated system based on Monorepo architecture, characterized by Based on the Monorepo architecture, it includes warehouse management module, script management module and deployment management module. The warehouse management module clarifies the boundaries and relationships of each sub-project according to the naming conventions and directory hierarchy, optimizes the directory structure of the single warehouse, and centrally manages all sub-projects and public libraries of the front-end project. The script management module creates automated scripts through script tools based on project characteristics and requirements. The automated scripts automate the entire process of code pulling, dependency parsing, building packaging, and deployment online. The automated scripts are packaged through the version control system Git, and an automated version update and synchronization mechanism is designed to ensure that each sub-project uses the correct branch and version, and record change details. The deployment management module controls the deployment of front-end projects through a visual build engine, integrating various project management functions including version management, dependency analysis, build configuration, and deployment monitoring. It can be operated by dragging and clicking, and intuitively displays the current status, dependencies, and change history of each sub-project.

8. An integrated device based on Monorepo architecture, characterized by include: at least one memory and at least one processor; The at least one memory is used to store a machine-readable program; The at least one processor is used to call the machine-readable program to execute an integration method based on the Monorepo architecture as described in any one of claims 1 to 6.

Images