WO2022121971A1 - Front-end project processing method and apparatus, device, management system, and storage medium - Google Patents

Abstract

Disclosed herein are a front-end project processing method and apparatus, a device, a management system, and a storage medium. The front-end project processing method comprises: acquiring target source code corresponding to multiple service lines from within a target source code storage warehouse corresponding to a target project to be constructed; performing a construction operation on the basis of the target source code to obtain a construction product corresponding to the target project, the construction product comprising multiple web page files respectively corresponding to the multiple service lines and public static resources corresponding to the multiple service lines; and classifying and publishing the construction product to a server end.

Description

Front-end item processing method, device, equipment, management system and storage medium

This application claims the priority of the Chinese patent application with application number 202011457915.7 filed with the China Patent Office on December 10, 2020, the entire contents of which are incorporated herein by reference.

technical field

The present application relates to the field of computer technology, for example, to a front-end item processing method, apparatus, device, management system, and storage medium.

Background technique

With the rapid development of Internet technology, the business scope of many Internet companies has become more and more extensive, and different applications can be developed for different business lines. Each business line within a company has its own development process. Developers of different business lines may adopt similar development methods and similar construction tools, but there are some differences between different business lines.

In order to meet the needs of users and enhance the freshness of the application, Internet companies usually add some new functions, such as launching some new activities or gameplays. At this time, the same gameplay may need to be used on different business lines at the same time. The gameplay may correspond to one or more pages, and each page can be developed as a separate project. In the development plan, it is necessary to develop for each business line, so that each project needs to be developed multiple times, or after the development of one business line is completed, copy the code from the code repository of this business line to the code of another business line In the warehouse, and then modify it to fit the code of another business line. Such migration still takes a certain amount of time to complete, and since the code is divided into two sets, both sets of code need to be maintained in subsequent update iterations.

It can be seen that when there are similar development requirements in multiple business lines, the development process is cumbersome, time-consuming, inefficient, and needs to be improved.

SUMMARY OF THE INVENTION

The present application provides a front-end project processing method, apparatus, device, management system and storage medium, which can simplify the development scheme of similar projects of multiple business lines.

The application provides a front-end project processing method, the method includes:

Obtain the target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be built;

A construction operation is performed based on the target source code, and a construction product corresponding to the target project is obtained, wherein the construction product includes a plurality of webpage files corresponding to the plurality of business lines respectively, and a plurality of business lines corresponding to the plurality of business lines. public static resources;

The classification of the construction product is published to the server.

The application provides a front-end item processing device, the device includes:

The target source code obtaining module is set to obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be built;

A project building module, configured to perform a construction operation based on the target source code to obtain a construction product corresponding to the target project, wherein the construction product includes a plurality of webpage files corresponding to the plurality of business lines respectively, and the Public static resources corresponding to multiple business lines;

A construction product release module is configured to release the construction product classification to the server.

The present application provides a computer device, including a memory, a processor, and a computer program stored in the memory and running on the processor, where the processor implements the above-mentioned front-end item processing method when executing the computer program.

The present application provides a project management system, including computer equipment, a warehouse management system, and a server provided by the embodiments of the present application, wherein the warehouse management system is configured to manage a target source code storage warehouse, and the server is configured as a storage server Received build artifacts.

The present application provides a computer-readable storage medium on which a computer program is stored, and when the program is executed by a processor, the above-mentioned front-end item processing method is implemented.

Description of drawings

1 is a schematic flowchart of a front-end item processing method provided by an embodiment of the present application;

2 is a schematic flowchart of another front-end item processing method provided by an embodiment of the present application;

3 is a schematic diagram of a project construction process provided by an embodiment of the present application;

4 is a schematic flowchart of another front-end item processing method provided by an embodiment of the present application;

5 is a schematic diagram of a project development and construction process provided by an embodiment of the present application;

6 is a structural block diagram of a front-end item processing apparatus provided by an embodiment of the present application;

FIG. 7 is a structural block diagram of a computer device according to an embodiment of the present application.

Detailed ways

The present application will be described below with reference to the accompanying drawings and embodiments. The specific embodiments described herein are merely used to explain the present application. For the convenience of description, only the parts related to the present application are shown in the drawings.

Fig. 1 is a schematic flow chart of a front-end item processing method provided by an embodiment of the application, and the method can be executed by a front-end item processing apparatus, wherein the apparatus can be realized by software and/or hardware, and can generally be integrated in computer equipment. Optionally, a build script may be written, and the method in the embodiments of the present application may be implemented by executing the build script. As shown in Figure 1, the method includes:

Step 101: Obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be constructed.

Exemplarily, Internet companies may develop different applications for different business lines. For example, the same Internet company may have short video services, live broadcast services, and personalized video recommendation services at the same time, and can develop different applications for different business lines for users to use, that is, each application can be considered to correspond to For a line of business, the application program here can be an application program installed in the terminal that runs independently and can access Internet web pages, or it can be a web page (Web) application program accessed through a browser. The target source code corresponding to multiple business lines in the embodiment of the present application can also be understood as the target source code corresponding to different application programs, that is, the source code obtained by developing for different application programs. During application development, one of the pages or web pages can correspond to a project.

Each business line has its own development process. Developers of different business lines may adopt similar development methods and similar build tools, but there are some differences between different business lines. For different business lines, sometimes there is a need to add similar functions, for example, some new activities or gameplays will be launched. At this time, the same gameplay may need to be used on different business lines at the same time, and the gameplay may correspond to one or more web pages. Each webpage can be developed as a separate project and applied to multiple application programs, and the project with the above-mentioned development requirements can become the target project in the embodiment of the present application, that is, the target project in the embodiment of the present application can be understood For any one or more projects that currently need to be built that exist in multiple lines of business but have individual differences for different lines of business.

Exemplarily, the source code storage warehouse may exist in a warehouse management system, and the embodiments of the present application do not limit the implementation manner and type of the warehouse management system, for example, it may be Gitlab. Gitlab is an open source project for warehouse management system. It uses git as a code management tool and builds web services on this basis. Gitlab provides functions such as group and project warehouses to facilitate project management. A runner tool is provided to help build. Optionally, build scripts can be executed by runners. The target source code storage warehouse can be understood as the source code storage warehouse corresponding to the target project. Optionally, in the warehouse management system, each project corresponds to an independent source code storage warehouse, which is implemented in a group, such as a gitlab group. The group contains all projects, which can effectively reduce the warehouse volume, and users (ie, Developers) when they need to pull the source code of the current project, they can only pull the code of the current project from the corresponding warehouse of the current project to improve the pulling efficiency, while all projects in related technologies are stored in one warehouse, and the warehouse volume will increase over time. It is getting bigger and bigger, and every time you pull the code, you need to pull down all the projects, which is cumbersome and time-consuming.

Exemplarily, the warehouse management system may also include a template warehouse, and developers can pre-write the code of the initialization project (act_demo) and store them in the template warehouse. When a project needs to be developed, developers can use front-end scaffolding tools ( Such as fed-cli, etc.) pull the code in act_demo to the local, as the initial code of the new project, and create the corresponding source code storage warehouse in the warehouse management system by remote means. Developers can develop multiple business lines for the target project locally. After the development is completed, the corresponding code is submitted to the corresponding source code storage warehouse, and the target source code corresponding to the target project is stored in the source code storage warehouse.

In the embodiment of the present application, when the construction conditions of the target project are satisfied, the target source code corresponding to multiple business lines can be obtained from the target source code storage warehouse corresponding to the target project to be constructed, and the construction conditions can be set according to actual requirements.

Step 102: Perform a corresponding construction operation based on the target source code to obtain a construction product corresponding to the target project, wherein the construction product includes a plurality of webpage files corresponding to the plurality of business lines, and the plurality of Public static resources corresponding to each business line.

The construction operation is not limited in the embodiment of the present application, and may be set according to the construction tool used and the actual situation of the target project, which may generally be completed by a front-end construction machine. The build products are generally static resources, including web page (html) files and other static resources. Here, the html file may refer to a file in Hyper Text Markup Language (HTML) format, with .html as the file suffix. Other static resources may include, for example, css files and js files. Since the target project exists in multiple lines of business, that is, multiple applications have web pages corresponding to the same function, there are many static resources that are the same or similar, and these static resources can be called corresponding to multiple lines of business. Public static resources. In addition, there are individual differences in target items in different business lines, which are mainly reflected in html files. In the embodiment of the present application, different business lines need to correspond to different html files. This setting considers that, on the one hand, Web pages are limited by default titles. The default titles are solidified in html files. Different business lines generally need to implement different default titles, so different html files are required. On the other hand, different business lines can also exist in public static resource libraries. A small number of static resources with different import requirements, and different html files can import different static resources, so it is also convenient to introduce different static resources in the public static resource library in different business lines.

Step 103: Publish the construction product classification to the server.

Exemplarily, after completing the construction operation and obtaining the corresponding construction product, the construction product can be classified and then directly published to the corresponding server; or after the classification is completed, it can be respectively submitted to the corresponding construction product storage warehouse, Then submit the resources in the build product storage warehouse (for example, through the code publisher) to the corresponding server. Among them, the construction product storage warehouse may also exist in the warehouse management system. When classifying the construction product, it can be divided into web page files and public static resources, and can also be classified for public static resources, which is not limited in this embodiment.

In the front-end project processing method provided in the embodiment of the present application, the target source code corresponding to multiple business lines is obtained from the target source code storage warehouse corresponding to the target project to be built, and the corresponding construction operation is performed based on the target source code to obtain the construction corresponding to the target project. product, wherein the construction product includes multiple webpage files corresponding to multiple business lines and public static resources corresponding to multiple business lines, submit the construction product classification to the corresponding product storage warehouse, and store the resources in the product storage warehouse Published to the server, wherein the server uses a preset directory structure to store the plurality of webpage files and the public static resources separately. By adopting the above technical solution, for the situation that a front-end project corresponds to the development requirements of multiple business lines, the corresponding target source code can be stored in the target source code storage warehouse corresponding to the project in advance, and when the project is constructed, multiple projects can be constructed at one time. Multiple webpage files corresponding to business lines and public static resources corresponding to each other are published to the server, which simplifies the construction process, improves construction efficiency, reduces development costs, and speeds up business iteration.

In some embodiments, constructing multiple webpage files corresponding to the multiple business lines based on the target source code includes: determining the target quantity according to the total number of the multiple business lines; The template is copied for a preset number of times to obtain the initial webpage files of the target number, wherein the preset number of times is equal to the target number; and the webpages corresponding to the plurality of business lines in the target source code are read respectively. file configuration information; correspondingly configure the target number of initial webpage files according to the webpage file configuration information corresponding to the multiple business lines respectively, and obtain multiple webpage files corresponding to the multiple business lines respectively. The advantage of this setting is that developers can uniformly develop a template corresponding to a webpage file. Since the webpages of the target projects corresponding to different business lines are relatively similar, the differences between different webpage files are also small. Therefore, it is possible to only target the difference parts. Write web page file configuration information to save development costs and improve development efficiency. During construction, the webpage file template is copied multiple times, and corresponding configuration is performed according to the webpage file configuration information, so that multiple webpage files corresponding to different business lines can be quickly and accurately constructed. The target quantity is generally equal to the total number of multiple business lines, that is, each business line corresponds to an initial web page file. The details of the corresponding configuration of the initial webpage file according to the webpage file configuration information are not limited, for example, modifications such as addition, deletion, and replacement may be included.

In some embodiments, the configuration information of the webpage file includes replacement configuration information; and the corresponding configuration of the initial webpage file according to the configuration information of the webpage file includes: setting a value in a preset field in the initial webpage file The initial content is replaced with the corresponding target content in the replacement configuration information. The advantage of this setting is that, by directly replacing the field content, the personalized configuration of the web page file can be quickly realized. Among them, the initial content can be understood as placeholder content, and the target content is the real content corresponding to the current business line. For example, when the application name needs to be replaced, the initial content can be set to "APP__REPLACEMENT" in the corresponding field, and the target content can be The actual corresponding application name of the current business line, such as "XXLIVE".

In some embodiments, the obtaining target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be built includes: obtaining project information corresponding to the target project to be built; judging according to the project information Whether the preset automatic construction conditions are met, and if the preset automatic construction conditions are met, the target source code corresponding to multiple business lines is obtained from the target source code storage warehouse corresponding to the target project. The advantage of this setting is that the automatic build conditions can be set in advance. When the conditions are met, the subsequent related build operations can be directly performed, which saves labor costs and improves the timeliness of project construction. The preset automatic construction conditions can be set according to actual needs, such as considering the actual use environment or the stage of the business.

In some embodiments, the project information includes a branch identifier; the judging whether a preset automatic construction condition is satisfied according to the project information includes: judging whether the branch corresponding to the target project is a test environment branch according to the branch identifier Or a grayscale environment branch, if the branch corresponding to the target item is a test environment branch or a grayscale environment branch, it is determined that the preset automatic construction condition is satisfied. The advantage of this setting is that, for the test environment, the resources finally released to the server will generally not be put into use, that is, the user will not obtain the corresponding resources, which is in the experimental stage and will not have adverse effects on the user. Therefore, in order to improve the Test the timeliness and efficiency, reduce the manual operation of testers, and can be set to automatic construction; for the grayscale environment, the resources finally released to the server are only used for grayscale experiments, that is, grayscale users who participate in the grayscale experiments will get it Corresponding resources will not have adverse effects on a large number of users. Therefore, in order to improve the timeliness and efficiency of grayscale experiments and reduce the manual operation of experimenters, automatic construction can be set. The project information may include a project name and a branch name, and the branch name may include a test environment branch, a grayscale environment branch, a production environment branch, and the like.

When building a project, you may sometimes need to use dependency packages. Taking the node project as an example, the dependent package can be understood as the package that depends on the development and deployment. Generally, it is stored in the node_modules folder in the project root directory. The package version number is saved through package.json, and the npm install command is used to install it. . In some embodiments, when the first build operation is performed for the target project, the required dependency package installation file can be downloaded from the project package management tool (Node Package Manager, NPM), and the dependency package installation file can be installed to obtain this time. Build the required dependencies. After the first build operation is completed, the installed dependency package and the version information of the dependency package can be stored. The version information of the dependency package can include, for example, the version number. The saved version information of the dependency package and the dependency package can be used for reference in the next build operation. or use.

In some embodiments, before performing the corresponding construction operation based on the target source code, the method further includes: judging whether the version of the dependency package in the target source code is consistent with the version of the dependency package when the construction operation was performed last time, and if so If the version of the dependency package in the target source code is consistent with the version of the dependency package when the build operation was performed last time, the locally installed dependency package is determined as the target dependency package; correspondingly, the corresponding build operation is performed based on the target source code. , including: performing a corresponding construction operation based on the target source code and the target dependency package. The advantage of this setting is that when the version of the dependency package used in this build operation is the same as the version of the dependency package used in the previous build operation, the installed corresponding dependency package can be directly determined as the target dependency package, that is, The installed dependency package that is consistent with the version of the dependency package in the target source code is determined as the target dependency package and participates in the subsequent build operations.

In some embodiments, after judging whether the version of the dependency package in the target source code is consistent with the version of the dependency package when the build operation was performed last time, the method further includes: if the version of the dependency package in the target source code is the same as the last time the build operation is performed If the version of the dependency package during the construction operation is inconsistent, download the corresponding dependency package installation file according to the version of the dependency package in the target source code, and install the dependency package installation file to obtain the target dependency package; The dependent package version and the target dependent package are stored. The advantage of this setting is that if the version of the dependent package in the target source code is inconsistent with the version of the dependent package when the build operation was performed last time, it means that the dependent package required for this build operation has changed and needs to be reinstalled to ensure that Accuracy of build operations. Exemplarily, a new dependency package installation file that is consistent with the version of the dependency package in the target source code may be downloaded from NPM, and installed, and the dependency package obtained after installation is applied to the subsequent build operations.

In some embodiments, after judging whether the preset automatic construction conditions are met according to the project information, the method further includes: if the preset automatic construction conditions are not met, determining that the branch corresponding to the target project is a production environment branch; When it is detected that the preset build event is triggered, the target source code corresponding to the multiple business lines is obtained from the target source code storage warehouse corresponding to the target project to be built. In general, the production environment is the production environment other than the test environment and the grayscale environment. The production environment branch can also be called the official branch, that is, the branch that needs to be officially put into use. After the corresponding resources are released, all users can generally use the corresponding applications and Obtain the corresponding resources. For the production environment, if there is a problem after the release, it will affect the use of all users. Therefore, it is generally not automatically built, but needs to be triggered separately. The triggering conditions of the preset build events can be set according to actual needs, for example, they can be manually triggered by workers. Taking Gitlab as an example, you can manually enter build instructions on the Gitlab page to trigger preset build events.

In some embodiments, before performing the corresponding construction operation based on the target source code, the method further includes: judging whether there is a dependency package of the installed grayscale environment locally, if there is no local dependency of the installed grayscale environment If there is an installed dependency package of the grayscale environment locally, then judge whether the version of the dependency package in the target source code is the same as the dependency package of the dependency package of the grayscale environment when the build operation was performed last time. The versions are consistent. If the version of the dependency package in the target source code is the same as the version of the dependency package of the grayscale environment when the build operation was performed last time, the locally installed dependency package is determined as the target dependency package. If the If the version of the dependent package in the target source code is inconsistent with the version of the dependent package of the grayscale environment when the last build operation was performed, a build failure message will be returned. The advantage of this setting is that for the production environment, some conditions can be set to avoid the inability to publish after the build is completed, resulting in the build operation becoming meaningless and reducing unnecessary production costs. For the production environment, if there is no local dependency package of the installed grayscale environment, it means that the version of the dependency package has not been grayscale verified, and if the code without grayscale verification is directly published online, it may cause A wide range of adverse effects, therefore, can be designed to not allow publishing, therefore, no build operation is performed, and a build failure message can be returned. In addition, if there is an installed dependency package of the grayscale environment, but the version of the dependency package in the target source code is inconsistent, it also means that the dependency package required for the current build operation has not been grayscale verified, and a build failure message can be returned.

In some embodiments, the public static resources include a resource map file; and publishing the construction product classification to the server includes: removing the resource map file from the plurality of webpage files and the public static resources Publish resources other than the resource map file to the first server; publish the resource map file in the resource map file storage warehouse to the second server. The advantage of this setting is that the resource map file (sourcemap) is generally used for business monitoring by staff and has nothing to do with the user's use. Therefore, it can be released to different servers separately from other static resources to avoid excessive occupation of the first Server-side storage resources. Optionally, the first server is a Content Delivery Network (CDN) server, and CDN is an intelligent virtual network built on a network basis, relying on edge servers deployed in multiple places, through the load balancing of the central platform. , content distribution, scheduling and other functional modules to enable users to obtain the required content nearby, reduce network congestion, and improve user access response speed and hit rate. The positive effect is that there are benefits such as speeding up the display speed of web pages. The second server can be a business log monitoring server, which can be set according to the actual situation, for example, it can be a sentry machine.

In some embodiments, the server uses a relative path to store the plurality of webpage files and the public static resources separately. For example, in a CDN, a relative path storage method can be used to store multiple webpage files and public static resources separately. The advantage of using a relative path is that when the domain name is the same, the relative path can make the page more flexible. When the domain name is blocked, because the relative path inherits the domain name of the main domain of the page without additional processing, there is no need to worry about static resources due to the blocked domain name. In the case of use, as long as the main domain name is available, the page can be used. The main domain name can be configured and replaced at the entrance, and there is no need to develop and manually replace it when the domain name is blocked. Optionally, a preset directory structure is used to store multiple webpage files and public static resources separately, and the preset directory structure can be set according to actual requirements. The advantages of separating html files from other static resources are: on the one hand, rollback is considered. If there is a problem with publishing, only the html file needs to be rolled back. Since the html file introduces different static resources, only the html file can be rolled back. All rollback is convenient and quick; on the other hand, it is for the consideration of directory allocation, because different business lines need to apply different html files, but there is only one public static resource, and it is more convenient for directory management to separate html files and other static resources. .

FIG. 2 is a schematic flowchart of another front-end project processing method provided by an embodiment of the present application, and FIG. 3 is a schematic diagram of a project construction process provided by an embodiment of the present application. Refer to FIG. 3 to understand the embodiment of the present application, as shown in FIG. 2 As shown, the method may include:

Step 201: Obtain the branch identifier corresponding to the target project to be constructed.

Exemplarily, variables to be used may be obtained first, which may be called project information, and the project information may include branch names (ie, branch identifiers) and project names, etc., and then determine whether the branch is reasonable.

Step 202: Determine whether the branch corresponding to the target item is a test environment branch or a grayscale environment branch according to the branch identifier. If the branch corresponding to the target item is a test environment branch or a grayscale environment branch, perform step 203; if the branch corresponding to the target item Step 207 is performed without branching for the test environment or the grayscale environment.

As shown in Figure 3, the branch identification includes formal branch, gray branch and test branch. If the branch identifier is a grayscale branch or a test branch, the target project can be automatically built; if the branch identifier is an official branch, the target project can be manually triggered to build.

Step 203: Obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project.

Exemplarily, if the target project can be built, the corresponding folder can be searched according to the project name. If the corresponding folder already exists, it means that the target project has been built, and the corresponding Gitlab repository ( That is, the target source code storage warehouse) to pull the code, if the corresponding folder does not exist, it proves that it is the first time to build the target project, and you need to copy the code from the target source code storage warehouse.

Step 204: Determine whether the version of the dependency package in the target source code is consistent with the version of the dependency package when the build operation was performed last time. If the version of the dependency package in the target source code is consistent with the version of the dependency package when the build operation was performed last time, step 205 is performed. ; If the version of the dependent package in the target source code is inconsistent with the version of the dependent package when the build operation was performed last time, step 206 is executed.

Exemplarily, the version of the dependency package in the target source code can be included in the package.json file, therefore, it can be determined by comparing whether the package.json file is the same or not to determine the version of the dependency package in the target source code and the dependency package when the last build operation was performed. Is the version consistent. As shown in Figure 3, for the grayscale branch, you can compare whether the current package.json and the package.json of the grayscale environment are the same. If the current package.json and the package.json of the grayscale environment are the same, the version is the same. If the package.json is different from the package.json of the grayscale environment, the version is inconsistent. For the test branch, you can compare whether the current package.json is the same as the test environment's package.json. If the current package.json is the same as the test environment's package.json, the version is the same. If the current package.json is the test environment's package.json. If the json is different, the version is inconsistent.

Step 205: Determine the locally installed corresponding dependency package as the first target dependency package, and perform a corresponding construction operation based on the target source code and the first target dependency package.

Step 206: Download the corresponding dependency package installation file according to the dependency package version in the target source code, and install the dependency package installation file to obtain a second target dependency package, and perform a corresponding construction operation based on the target source code and the second target dependency package.

Step 207: Determine that the branch corresponding to the target project is the production environment branch.

Step 208, determine whether the preset build event is triggered, if the preset build event is triggered, then execute step 209; if the preset build event is not triggered, repeat step 208.

Step 209: Obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be constructed.

Step 210: Determine whether there is an installed dependency package of the grayscale environment locally, if there is a locally installed dependency package of the grayscale environment, go to step 211; if there is no locally installed dependency package of the grayscale environment, execute Step 214.

Step 211: Determine whether the version of the dependency package in the target source code is consistent with the version of the previous dependency package. If the version of the dependency package in the target source code is consistent with the version of the previous dependency package, step 212 is executed; if the version of the dependency package in the target source code is the same as If the version of the last dependent package is inconsistent, step 214 is executed.

The last dependency package version refers to the dependency package version of the dependency package of the grayscale environment when the build operation was performed last time.

Exemplarily, for the official branch, that is, the production environment branch, you can compare whether the current package.json and the package.json of the grayscale environment are the same. If the current package.json and the package.json of the grayscale environment are the same, the versions are consistent , if the current package.json and the package.json of the grayscale environment are different, the versions are inconsistent.

Step 212: Determine the locally installed dependency package of the corresponding grayscale environment as the third target dependency package, and perform a corresponding construction operation based on the target source code and the third target dependency package.

Step 213 , classify and publish the construction product corresponding to the target project to the server.

The construction product includes multiple webpage files corresponding to the multiple business lines respectively, and public static resources corresponding to the multiple business lines.

Step 214, returning the construction failure information.

In the front-end project processing method provided by the embodiment of the present application, on the basis of the above-mentioned optional embodiments, it is first determined whether to support automatic construction of the target project according to the branch identifier, and if automatic construction of the target project is supported, the construction of the target project is automatically started. For the target project, you need to build the target project after triggering the preset build event, so as to control the start of the build process more reasonably. Before executing the build operation, the corresponding judgment is also made for the dependent package. Under the official branch, if there is no dependency package of the grayscale environment or the dependency package in the target source code is inconsistent with the dependency package of the grayscale environment, the build target is not allowed. project, to avoid non-gray-verified dependency packages participating in the release target project, and under other branches, if the dependency package corresponding to the current dependency package version has been successfully installed, you can directly build the target project to avoid reinstalling the dependency package and improve Building efficiency can reduce development costs and speed up business iteration.

FIG. 4 is a schematic flowchart of another front-end project processing method provided by an embodiment of the present application, and FIG. 5 is a schematic diagram of a project development and construction process provided by an embodiment of the present application. Refer to FIG. 5 for understanding of the embodiment of the present application. As shown in Figure 4, the method includes:

Step 401: Obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be constructed.

Exemplarily, as shown in Figure 5, a developer can create a project through fed-cli before development, and a gitlab group is formed in gitlab in the form of fed-activity. The gitlab group includes a template repository for storing act_demo and a source code repository for storing the source code of multiple projects (the number is not limited, only 3 projects are schematically listed in Figure 5, project1, project2 and project3) , a static resource storage warehouse for storing public static assets of preset types (release-assets) to be released, an html storage warehouse for storing web page files (release-pages) to be released, and a resource map for storing to-be-released resources The sourcemap of files (release-maps) is stored in the repository. After the developer creates the project, he pulls the code from the template warehouse to initialize the local project, and after the development is completed, pushes the source code to the corresponding source code storage warehouse (project1 is taken as an example in the figure). Then, the local development connects to the packaging and compilation server (webpack-dev-server), and firstly determines whether it is a gray branch (gray), a test branch (test) or a production branch (prod) through the front-end construction machine, and supports different branches according to the branch type. The build trigger method, after triggering the build, obtain the target source code from the source code storage warehouse.

Step 402: Determine the target dependency package according to the dependency package version in the target source code.

The target dependency package here can be the dependency package stored after the last build, or the dependency package that has been downloaded and installed again. For the determination method, please refer to the relevant content above, and will not be repeated here.

Step 403: Perform a corresponding construction operation based on the target source code and the target dependency package to obtain a construction product corresponding to the target project.

The process of constructing multiple webpage files corresponding to multiple business lines based on the target source code and the target dependency package may include: determining the number of targets according to the total number of multiple business lines, and performing the same steps on the webpage file templates in the target source code as the number of targets. The preset number of times of copying, read the replacement configuration information corresponding to multiple business lines in the target source code, replace the initial content in the preset field in the initial web page file with the corresponding target content in the replacement configuration information, and obtain multiple Multiple webpage files corresponding to business lines respectively.

Exemplarily, when the parameter (that is, the preset field) is AAA, the text to be replaced (that is, the initial content) can be expressed as AAA__REPLACEMENT, and a double underscore can be used between the two to avoid duplication with other texts.

For example, replacement configuration information can include the following:

If you read the above configuration information, the replacement method can be:

Replace the TITLE__REPLACEMENT text in the html under the blive folder with 'BLIVE'; replace the TITLE__REPLACEMENT text in the html under the llive folder with 'LLIVE'; replace the APP__REPLACEMENT text in the html under the blive folder with 'blive' ; Replace the APP__REPLACEMENT text in the html under the llive folder with 'llive'.

Step 404: Divide the construction product into multiple webpage files, resource map files and preset type public static resources corresponding to multiple business lines respectively.

The resource map file and the preset type public static resource together constitute the public static resource. As shown in Figure 5, the build products are divided into html, sourcemap and assets.

Step 405: Submit the webpage file to the corresponding webpage storage warehouse, submit the resource map file to the corresponding resource map storage warehouse, and submit the preset type public static resources to the corresponding static resource storage warehouse.

As shown in Figure 5, html is submitted to the html storage warehouse, sourcemap is submitted to the sourcemap storage warehouse, and assets are submitted to the assets storage warehouse.

Step 406: Publish the resources in the webpage storage warehouse to the content distribution network server, publish the resources in the resource map storage warehouse to the business log monitoring server, and publish the resources in the static resource storage warehouse to the content distribution network server.

As shown in Figure 5, the resources in the html storage warehouse are synchronized (rsync) to the CDN source, the resources in the sourcemap storage warehouse are synchronized to the senry machine, and the resources in the assets storage warehouse are synchronized to the CDN source.

Optionally, the launch time of target projects in different business lines may be different. In order to ensure that the release of the code of one business line does not affect other business lines, the name of the business line can be filled in during construction. Modifying the html file corresponding to the entered business line name will not affect other business lines that do not need to be changed.

Exemplarily, in the CDN source, a preset directory structure may be used to store webpage files and public static resources of preset types separately by adopting a relative path.

Exemplarily, a schematic description of a directory structure is provided below:

Root directory

--as

----assets

------project1

--------css

----------style.css

--------js

----------js.js

------project2

----libs

------lib1

--------v1.1.0

--------v1.1.1

------lib2

--pages

----project1

------app1

--------index.html

------app2

----project2

The above directory structure is explained below:

as: the abbreviation of asia, which is the rule requirement for image scaling and conversion; assets: stores files in css format and js format; project1: project name; libs: the directory of the shared library, the shared library may need to introduce multiple projects, which can be placed outside , and at the same time, for the convenience of maintenance, version control can be performed, such as v1.1.0 and v1.1.1 below. pages: stores files in html format; app1: business line name.

The front-end project processing method provided by the embodiments of this application realizes that a set of codes is used by multiple business lines, reduces development costs, and speeds up business iteration. Developers only need to develop one set of codes, and finally construct multiple html files for different business lines. Different business lines can be used in different business lines, and different business lines can be introduced into different resources by text replacement, so as to realize the differentiated processing of different business lines. By storing the source code of different projects in different warehouses, the warehouse volume is reduced. Therefore, the speed of pulling the code becomes faster, and the dependency package is saved. When the version of the dependency package remains unchanged, there is no need to download the dependency package again. At the same time, because the dependency package of the grayscale environment is used in the production environment, the production The environment does not need to install dependency packages, and the packaging is faster. In addition, since all the static resources introduced are relative paths, there is no need to worry about the static resources being unavailable due to the banned domain name. As long as the main domain domain name is available, the page can be used.

FIG. 6 is a structural block diagram of a front-end item processing apparatus provided by an embodiment of the present application. The apparatus can be implemented by software and/or hardware, and can generally be integrated in computer equipment. The front-end item processing method can be executed to perform front-end item correlation. deal with. As shown in Figure 6, the device includes:

The target source code acquisition module 601 is configured to obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be constructed; the project construction module 602 is configured to perform corresponding construction operations based on the target source code, and obtain The construction product corresponding to the target project, wherein the construction product includes multiple webpage files corresponding to the multiple business lines respectively, and public static resources corresponding to the multiple business lines; the construction product publishing module 603, It is set to publish the classification of the construction product to the server.

The front-end project processing device provided in the embodiment of the present application obtains target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be built, and performs corresponding construction operations based on the target source code to obtain the construction corresponding to the target project. product, wherein the construction product includes multiple webpage files corresponding to multiple business lines and public static resources corresponding to multiple business lines, submit the construction product classification to the corresponding product storage warehouse, and store the resources in the product storage warehouse Published to the server, wherein the server uses a preset directory structure to store the plurality of webpage files and the public static resources separately. By adopting the above technical solution, for the situation that a front-end project corresponds to the development requirements of multiple business lines, the corresponding target source code can be stored in the target source code storage warehouse corresponding to the project in advance, and when the project is constructed, multiple projects can be constructed at one time. Multiple webpage files corresponding to business lines and public static resources corresponding to each other are published to the server, which simplifies the construction process, improves construction efficiency, reduces development costs, and speeds up business iteration.

The embodiments of the present application provide a computer device, in which the front-end item processing apparatus provided by the embodiments of the present application can be integrated. FIG. 7 is a structural block diagram of a computer device according to an embodiment of the present application. The computer device 700 includes a memory 701, a processor 702, and a computer program that is stored in the memory 701 and can run on the processor 702. When the processor 702 executes the computer program, the front-end item processing method provided by the embodiment of the present application is implemented. .

The embodiments of the present application provide a project management system, including the computer equipment, the warehouse management system, and the server provided by the embodiments of the present application, wherein the warehouse management system is set to manage a target source code storage warehouse, and the server is set to a storage service The build product received by the end.

Embodiments of the present application further provide a storage medium containing computer-executable instructions, where the computer-executable instructions, when executed by a computer processor, are used to execute the front-end item processing method provided by the embodiments of the present application. Wherein, the storage medium may be a non-transitory storage medium.

The front-end item processing apparatus, device, and storage medium provided in the foregoing embodiments can execute the front-end item processing method provided by any embodiment of the present application, and have corresponding functional modules and effects for executing the method. For technical details not described in detail in the foregoing embodiments, reference may be made to the front-end item processing method provided by any embodiment of the present application.

Claims (15)

1. A front-end project processing method, including:

   Obtain the target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be built;

   A construction operation is performed based on the target source code, and a construction product corresponding to the target project is obtained, wherein the construction product includes a plurality of webpage files corresponding to the plurality of business lines respectively, and a plurality of business lines corresponding to the plurality of business lines. public static resources;

   The classification of the construction product is published to the server.
2. The method according to claim 1, wherein a construction operation is performed based on the target source code to obtain a plurality of webpage files corresponding to the plurality of business lines, comprising:

   determining the target quantity according to the total number of the plurality of business lines;

   Copying the webpage file template in the target source code for a preset number of times to obtain the initial webpage file of the target number, wherein the preset number of times is equal to the target number;

   Read the webpage file configuration information corresponding to the multiple business lines in the target source code;

   The initial webpage files of the target number are configured according to the webpage file configuration information corresponding to the multiple business lines respectively, to obtain multiple webpage files corresponding to the multiple business lines respectively.
3. The method of claim 2, wherein the webpage file configuration information includes replacement configuration information;

   The configuring the initial webpage files of the target number according to the webpage file configuration information corresponding to the plurality of business lines respectively includes:

   The initial content in the preset field in the initial web page file is replaced with the target content in the replacement configuration information corresponding to the initial web page file.
4. The method according to claim 1, wherein the obtaining the target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be constructed comprises:

   Obtain project information corresponding to the target project to be constructed;

   According to the project information, it is determined whether the preset automatic construction conditions are met, and in response to the preset automatic construction conditions being met, the targets corresponding to the multiple business lines are obtained from the target source code storage warehouse corresponding to the target project to be constructed. source code.
5. The method of claim 4, wherein the project information includes a branch identification;

   The judging whether the preset automatic construction conditions are met according to the project information includes:

   Determine whether the branch corresponding to the target project to be built is a test environment branch or a grayscale environment branch according to the branch identifier, and respond that the branch corresponding to the target project to be built is the test environment branch or the grayscale environment branch The environment branch determines that the preset automatic construction condition is satisfied.
6. The method according to claim 5, before the building operation based on the target source code, further comprising:

   Judging whether the version of the dependent package in the target source code is consistent with the version of the dependent package in the case of the last execution of the build operation, in response to the version of the dependent package in the target source code and the version of the dependent package in the case of the last execution of the construction operation The package version is the same, and the locally installed dependency package is determined as the target dependency package;

   The building operation based on the target source code includes:

   The construction operation is performed based on the target source code and the target dependency package.
7. The method according to claim 6, after judging whether the version of the dependent package in the target source code is consistent with the version of the dependent package in the case of the last execution of the build operation, further comprising:

   In response to the inconsistency between the version of the dependent package in the target source code and the version of the dependent package in the case of the last execution of the build operation, download the dependent package installation file according to the version of the dependent package in the target source code, and install the dependent package Install the file to obtain the target dependency package;

   Store the dependency package version in the target source code and the target dependency package.
8. The method according to claim 4, after judging whether a preset automatic construction condition is satisfied according to the project information, further comprising:

   In response to not satisfying the preset automatic construction condition, determining that the branch corresponding to the target project is a production environment branch;

   When it is detected that a preset construction event is triggered, the target source code corresponding to the multiple business lines is obtained from the target source code storage warehouse corresponding to the target project to be built.
9. The method according to claim 8, before the building operation based on the target source code, further comprising:

   Determine whether there is a dependency package of the installed grayscale environment locally, and in response to the absence of a locally installed dependency package of the grayscale environment, return the build failure information; In response to the existence of a locally installed dependency package of the grayscale environment, determine the Whether the version of the dependent package in the target source code is consistent with the version of the dependent package of the grayscale environment in the case of the last execution of the build operation, in response to the version of the dependent package in the target source code and the last execution of the build operation In the case of the grayscale environment, the dependency package version of the dependency package is consistent, and the locally installed dependency package is determined as the target dependency package, in response to the dependency package version in the target source code and the last execution of the build operation. The version of the dependent packages of the dependent packages under the grayscale environment is inconsistent, and the build failure information is returned.
10. The method according to claim 1, wherein the public static resource includes a resource map file;

    The classification and publishing of the construction product to the server includes:

    Publishing resources other than the resource map file in the plurality of webpage files and the public static resources to the content distribution network server;

    The resource map file in the resource map file storage warehouse is published to the business log monitoring server.
11. The method according to claim 1, wherein the server uses a relative path to store the plurality of webpage files and the public static resources separately.
12. A front-end item processing device, comprising:

    The target source code obtaining module is set to obtain target source code corresponding to multiple business lines from the target source code storage warehouse corresponding to the target project to be built;

    A project building module, configured to perform a construction operation based on the target source code to obtain a construction product corresponding to the target project, wherein the construction product includes a plurality of webpage files corresponding to the plurality of business lines, and the Public static resources corresponding to multiple business lines;

    A construction product release module is configured to release the construction product classification to the server.
13. A computer device, comprising a memory, a processor, and a computer program stored on the memory and executable on the processor, wherein the processor implements the computer program as described in claims 1-11 when the processor executes the computer program Any one of the front-end item processing methods.
14. A project management system, comprising computer equipment as claimed in claim 13, a warehouse management system and a server, wherein the warehouse management system is set to manage a target source code storage warehouse, and the server is set to store the build products received by the server .
15. A computer-readable storage medium storing a computer program, wherein when the program is executed by a processor, the front-end item processing method according to any one of claims 1-11 is implemented.

Images