Web page development methods, apparatus, equipment and storage media

Abstract

This invention relates to the field of computer technology and discloses a method, apparatus, device, and storage medium for developing web pages. The method includes: receiving a web page development request; responding to the request by invoking a pre-built business code library and a pre-built component code library; generating a web page framework based on the business code library; performing conversion processing on the component code library to generate component links corresponding to the component code library; introducing the component links into the web page framework; and generating the web page using the Render function of the Vue framework library. Through this method, the invention can achieve the separation of component code and business code, eliminating the need for further separation of component code, reducing code coupling among multiple developers and departments, lowering communication costs and maintenance management risks, improving page development efficiency, and solving the problem of low web page development efficiency caused by developers repeatedly reviewing code when collaborating with multiple people and departments.

Description

Technical Field

[0001] This invention relates to the field of computer technology, and in particular to a method, apparatus, device, and storage medium for developing web pages. Background Technology

[0002] With the rapid development of internet information technology and the increasing popularity of terminal devices, more and more applications (APPs) for terminal devices have been developed, greatly enriching people's lives and gradually becoming an indispensable part of people's work and life.

[0003] Front-end development is an essential part of application development. It refers to the process of creating web pages or applications that present the user interface to the user. Its main function is to present the interface of internet products to users in a better and more convenient way. This is achieved through tools such as Hyper Text Markup Language (HTML), Cascading Style Sheets (CCS), scripting languages ​​(JavaScript), and various other derived technologies, frameworks, and solutions to realize the user interface interaction of internet products.

[0004] The current development approach mainly involves componentizing web pages. Conventional page componentization development refers to cutting and separating the code of the front-end page according to "business lines" or "functional modules" to form individual code modules. Finally, various components are introduced at the page layer and pieced together to form a complete page.

[0005] However, current component-based page development is largely based on the same source code. When business scenarios are complex and involve collaboration among multiple departments and individuals, developers need to repeatedly analyze the code and familiarize themselves with the functionality of already deployed code. Therefore, developers must engage in extensive repetitive communication and strictly adhere to component segmentation, precise code management, and written code documentation. This development model is extremely time-consuming, significantly impacting development efficiency and schedule. With version updates and developer turnover, substantial testing manpower is required for regression testing, and the online code quality cannot be guaranteed, greatly reducing the efficiency of web page development. Summary of the Invention

[0006] This invention provides a method, apparatus, device, and storage medium for developing web pages, which can solve the problem of low efficiency in web page development when multiple people and departments collaborate, as developers need to repeatedly sort out the code.

[0007] To solve the above-mentioned technical problems, one technical solution adopted by the present invention is: to provide a Web page development method, comprising:

[0008] Receive a web page development request, and in response to the web page development request, invoke a pre-built business code library and a pre-built component code library;

[0009] Generate a web page framework based on the aforementioned business code library;

[0010] The component code library is transformed to generate component links corresponding to the component code library;

[0011] The component link is included in the web page framework, and the web page is generated using the Render function of the Vue framework library.

[0012] According to one embodiment of the present invention, the step of converting the component code library to generate a component link corresponding to the component code library further includes:

[0013] The component codebase is bundled using Webpack to generate the corresponding SDK package;

[0014] The SDK package is published to the server, generating a link to the component corresponding to the component code library.

[0015] According to one embodiment of the present invention, the step of introducing the component link into the web page framework and generating the web page using the Render function of the Vue framework library includes:

[0016] The component link is included in the web page framework, and the SDK package corresponding to the component link is called.

[0017] The Vue framework library's Render function instantiates a component object based on the SDK package and attaches the component object to the Window object, thereby obtaining the binding relationship between the Window object and the component object;

[0018] Based on Vuex state management, a Store object is generated according to the Web page framework and the Store object is attached to the Window object to obtain the binding relationship between the Window object and the Store object;

[0019] The web page is generated based on the binding relationship between the Window object and the component object, and the binding relationship between the Window object and the Store object.

[0020] According to an embodiment of the present invention, after instantiating a component object based on the SDK package using the Render function of the Vue framework library and attaching the component object to the Window object to obtain the binding relationship between the Window object and the component object, the method further includes:

[0021] When a deletion request for the component object is received, the binding relationship between the Window object and the component object is released in response to the deletion request.

[0022] According to an embodiment of the present invention, after instantiating a component object based on the SDK package using the Render function of the Vue framework library and attaching the component object to the Window object to obtain the binding relationship between the Window object and the component object, the method further includes:

[0023] When a replacement request for the component object is received, in response to the replacement request, the binding relationship between the Window object and the component object is released;

[0024] Obtain a new component object and attach the new component object to the Window object, establishing a binding relationship between the Window object and the new component object.

[0025] According to one embodiment of the present invention, before invoking the pre-built business code library and the pre-built component code library in response to the web page development request, the method further includes:

[0026] Determine if a pre-built component code library exists;

[0027] If so, then the step of invoking the pre-built component code library in response to the web page development request is performed;

[0028] If not, then notify the user to build and store the component code library, and perform the step of calling the pre-built component code library in response to the web page development request.

[0029] According to an embodiment of the present invention, before performing the conversion process on the component code library to generate a component link corresponding to the component code library, the method further includes:

[0030] Deploy the component codebase to the test environment to obtain the online environment address;

[0031] The online environment address is imported into the business codebase, and component functionality is tested.

[0032] The step of converting the component code library to generate component links corresponding to the component code library includes:

[0033] The component codebase that has passed the component functional test is transformed to generate a component link corresponding to the component codebase.

[0034] To solve the above-mentioned technical problems, another technical solution adopted by the present invention is: to provide a web page development device, comprising:

[0035] The calling module is used to receive web page development requests and, in response to the web page development requests, call the pre-built business code library and the pre-built component code library;

[0036] A page frame generation module is used to generate a web page frame based on the business code library;

[0037] The component link generation module is used to transform the component code library and generate component links corresponding to the component code library.

[0038] The page generation module is used to import the component links into the web page framework and generate the web page using the Render function of the Vue framework library.

[0039] To solve the above-mentioned technical problems, another technical solution adopted by the present invention is to provide a computer device, including: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to implement the Web page development method.

[0040] To solve the above-mentioned technical problems, another technical solution adopted by the present invention is to provide a computer storage medium on which a computer program is stored, wherein the computer program implements the above-mentioned Web page development method when executed by a processor.

[0041] The beneficial effects of this invention are as follows: By receiving a Web page development request, the invention invokes a pre-built business code library and a pre-built component code library in response to the request; a Web page framework is generated based on the business code library; the component code library is transformed to generate component links corresponding to the component code library; the component links are introduced into the Web page framework, and the Web page is generated using the Render function of the Vue framework library. This enables the separation of component code and business code, eliminating the need for further separation of component code, reducing code coupling among multiple people and departments, lowering communication costs and maintenance and management risks, improving page development efficiency, and solving the problem of low Web page development efficiency caused by developers repeatedly sorting out code when multiple people and departments collaborate. Attached Figure Description

[0042] Figure 1 This is a flowchart illustrating the Web page development method according to the first embodiment of the present invention;

[0043] Figure 2 This is a flowchart illustrating the Web page development method according to the second embodiment of the present invention;

[0044] Figure 3 This is a flowchart illustrating the Web page development method according to the third embodiment of the present invention;

[0045] Figure 4 This is a flowchart illustrating the Web page development method according to the fourth embodiment of the present invention;

[0046] Figure 5 This is a schematic diagram of the structure of a web page development device according to an embodiment of the present invention;

[0047] Figure 6 This is a schematic diagram of the structure of a computer device according to an embodiment of the present invention;

[0048] Figure 7 This is a schematic diagram of the structure of a computer storage medium according to an embodiment of the present invention. Detailed Implementation

[0049] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only a part of the embodiments of the present invention, and not all of them. Based on the embodiments of the present invention, all other embodiments obtained by those of ordinary skill in the art without creative effort are within the scope of protection of the present invention.

[0050] The terms "first," "second," and "third" used in this invention are for descriptive purposes only and should not be construed as indicating or implying relative importance or implicitly specifying the number of indicated technical features. Thus, a feature defined as "first," "second," or "third" may explicitly or implicitly include at least one of that feature. In the description of this invention, "a plurality of" means at least two, such as two, three, etc., unless otherwise explicitly specified. All directional indications (such as up, down, left, right, front, back, etc.) in the embodiments of this invention are only used to explain the relative positional relationships and movements between components in a specific orientation (as shown in the figures). If the specific orientation changes, the directional indications also change accordingly. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion. For example, a process, method, system, product, or device that includes a series of steps or units is not limited to the listed steps or units, but may optionally include steps or units not listed, or may optionally include other steps or units inherent to these processes, methods, products, or devices.

[0051] In this document, the term "embodiment" means that a particular feature, structure, or characteristic described in connection with an embodiment may be included in at least one embodiment of the invention. The appearance of this phrase in various places throughout the specification does not necessarily refer to the same embodiment, nor is it a separate or alternative embodiment mutually exclusive with other embodiments. It will be explicitly and implicitly understood by those skilled in the art that the embodiments described herein can be combined with other embodiments.

[0052] Figure 1 This is a flowchart illustrating the Web page development method according to the first embodiment of the present invention. It should be noted that if substantially the same result is achieved, the method of the present invention is not necessarily identical. Figure 1 The illustrated process sequence is limited. For example... Figure 1 As shown, the method includes the following steps:

[0053] Step S101: Receive a Web page development request, and in response to the Web page development request, call the pre-built business code library and the pre-built component code library.

[0054] In step S101, the business code library and component code library are separated to achieve code isolation. When a web page development request is received, the business code library and component code library required for web page development are determined based on the request. The business code library is pre-built by developers according to business line requirements, while the component code library can be pre-built by developers or built in real time.

[0055] In one feasible embodiment, upon receiving a web page development request, the system determines the component code library required for web page development based on the request and checks if a pre-built component code library exists. If so, it executes the step of calling the pre-built component code library in response to the web page development request; otherwise, it notifies the user to build and store the component code library, and then executes the step of calling the pre-built component code library in response to the web page development request. Specifically, before developing the component code library, developers need to obtain code development permissions from the component library administrator and use code management tools such as Git or SVN to develop the component code library. First, developers locate the corresponding business folder based on business requirements, write component files in the business folder, and after completion, execute the project command "build" based on all component files in the business folder to build the components and generate the component code library.

[0056] In one feasible embodiment, after the component codebase is developed, it is deployed to a test environment to obtain the online environment address; the online environment address is then imported into the business codebase and component functional testing is performed; finally, the component codebase that has passed the functional testing is stored. This embodiment improves the quality of component development through component functional testing of the component codebase, and storing the component codebase that has passed the functional testing facilitates subsequent reuse of the component codebase.

[0057] Step S102: Generate a web page framework based on the business code library.

[0058] In step S102, the Web page framework can be built based on a basic public framework, and the Web page code can include a preset basic framework public package and a business package. Specifically, the business package corresponding to the business code library is obtained, the business package and the preset basic framework public package are merged to obtain a merged business package, and the merged business package is loaded to generate the Web page framework.

[0059] Step S103: Transform the component code library to generate component links corresponding to the component code library.

[0060] In step S103, the conversion process of the component code library refers to transforming the component code library into a component link format. The source code in the component code library can be updated in real time, and the source code does not need to be divided according to function. The component code library provides a single component link externally, and the component code library can be located through the component link. The component link can be introduced into different business code. This embodiment is applicable to application scenarios involving multiple departments and multiple people, which can avoid code conflicts and code disorder caused by multiple departments and multiple people working together. It can enable multiple people to develop simultaneously without being aware of each other, thereby improving development efficiency.

[0061] Further, in step S103, the component code library is bundled using Webpack to generate the corresponding SDK package; the SDK package is published to the server to generate the component link corresponding to the component code library.

[0062] Step S104: Import component links into the web page framework and use the Vue framework library's Render function to generate the web page.

[0063] In step S104, component links are imported into the Web page framework, and the corresponding SDK package is called. The Vue framework library's Render function is used to instantiate a component object based on the SDK package and attach the component object to the Window object, obtaining the binding relationship between the Window object and the component object, thus completing DOM rendering. Based on Vuex's state management, a Store object is generated according to the Web page framework and attached to the Window object, obtaining the binding relationship between the Window object and the Store object. The Web page is generated based on the binding relationships between the Window object and the component object, and between the Window object and the Store object, enabling the component to access and apply Web page data through the binding relationships. In practical applications, the component sends data to the Web page through the `this.$emit("postMessage", data)` function. After receiving the data, the Web page executes the corresponding callback, thus completing the communication between the component and the Web page, and realizing the connection between the Web page, components, and business functions.

[0064] The Web page development method of the first embodiment of the present invention receives a Web page development request, and in response to the request calls a pre-built business code library and a pre-built component code library; generates a Web page framework based on the business code library; performs conversion processing on the component code library to generate component links corresponding to the component code library; introduces the component links into the Web page framework, and uses the Render function of the Vue framework library to generate the Web page. This method can achieve the separation of component code and business code, eliminating the need for further separation of component code, reducing code coupling among multiple people and departments, reducing communication costs and maintenance and management risks, improving page development efficiency, and solving the problem of low Web page development efficiency caused by developers needing to repeatedly sort out code when multiple people and departments collaborate.

[0065] Figure 2 This is a flowchart illustrating the Web page development method according to the second embodiment of the present invention. It should be noted that if substantially the same result is achieved, the method of the present invention is not necessarily identical. Figure 2 The illustrated process sequence is limited. For example... Figure 2 As shown, the method includes the following steps:

[0066] Step S201: Receive a Web page development request, and in response to the Web page development request, call the pre-built business code library and the pre-built component code library.

[0067] In this embodiment, Figure 2 Step S201 and Figure 1 The steps in step S101 are similar and will not be repeated here for the sake of simplicity.

[0068] Step S202: Generate a web page framework based on the business code library.

[0069] In this embodiment, Figure 2 Step S202 and Figure 1 Step S102 is similar and will not be repeated here for the sake of simplicity.

[0070] Step S203: Transform the component code library to generate component links corresponding to the component code library.

[0071] In this embodiment, Figure 2 Step S203 and Figure 1 The steps in step S103 are similar and will not be repeated here for the sake of simplicity.

[0072] Step S204: Import component links into the web page framework and use the Vue framework library's Render function to generate the web page.

[0073] In this embodiment, Figure 2 Step S204 and Figure 1 Step S104 is similar and will not be repeated here for the sake of simplicity.

[0074] Step S205: When a deletion request for a component object is received, the binding relationship between the Window object and the component object is released in response to the deletion request.

[0075] In step S205, after the binding relationship between the Window object and the component object is released, the component object that has been released from binding can be reused, and the Window object can establish binding relationships with other component objects, thereby changing the dynamics of the Web page.

[0076] The Web page development method of the second embodiment of the present invention, based on the first embodiment, supports dynamic page changes and improves user experience by debinding the Window object from the component object.

[0077] Figure 3 This is a flowchart illustrating the Web page development method according to the third embodiment of the present invention. It should be noted that if substantially the same result is achieved, the method of the present invention is not necessarily identical. Figure 3 The illustrated process sequence is limited. For example... Figure 3 As shown, the method includes the following steps:

[0078] Step S301: Receive a Web page development request, and in response to the Web page development request, call the pre-built business code library and the pre-built component code library.

[0079] In this embodiment, Figure 3 Step S301 and Figure 1 The steps in step S101 are similar and will not be repeated here for the sake of simplicity.

[0080] Step S302: Generate a web page framework based on the business code library.

[0081] In this embodiment, Figure 3 Step S302 and Figure 1 Step S102 is similar and will not be repeated here for the sake of simplicity.

[0082] Step S303: Transform the component code library to generate component links corresponding to the component code library.

[0083] In this embodiment, Figure 3 Step S303 and Figure 1 The steps in step S103 are similar and will not be repeated here for the sake of simplicity.

[0084] Step S304: Import component links into the web page framework and use the Vue framework library's Render function to generate the web page.

[0085] In this embodiment, Figure 3 Step S304 and Figure 1 Step S104 is similar and will not be repeated here for the sake of simplicity.

[0086] Step S305: When a replacement request for a component object is received, in response to the replacement request, the binding relationship between the Window object and the component object is released.

[0087] In step S305, after the binding relationship between the Window object and the component object is released, the component object that has been released from binding can be reused, and the Window object can establish binding relationships with other component objects, supporting dynamic changes to the Web page.

[0088] Step S306: Obtain the new component object and attach the new component object to the Window object to establish the binding relationship between the Window object and the new component object.

[0089] In step S306, by establishing a binding relationship between the Window object and the new component object, dynamic changes to the web page are supported, thereby improving the user experience.

[0090] The Web page development method of the third embodiment of the present invention, based on the first embodiment, supports dynamic changes to the Web page and improves the user experience by debinding the Window object from the component object and establishing a new binding relationship between the Window object and the component object.

[0091] Figure 4 This is a flowchart illustrating the Web page development method according to the fourth embodiment of the present invention. It should be noted that if substantially the same result is achieved, the method of the present invention is not necessarily identical. Figure 4 The illustrated process sequence is limited. For example... Figure 4 As shown, the method includes the following steps:

[0092] Step S401: Receive a Web page development request, and in response to the Web page development request, call the pre-built business code library and the pre-built component code library.

[0093] In this embodiment, Figure 4 Step S401 and Figure 1 The steps in step S101 are similar and will not be repeated here for the sake of simplicity.

[0094] Step S402: Generate a web page framework based on the business code library.

[0095] In this embodiment, Figure 4 Step S402 and Figure 1 Step S102 is similar and will not be repeated here for the sake of simplicity.

[0096] Step S403: Deploy the component codebase to the test environment and obtain the online environment address.

[0097] Step S404: Import the online environment address into the business code repository and perform component function testing.

[0098] Specifically, the online environment address is included in the business code repository so that testers can see the developed components on a web page and perform component functional tests. This embodiment improves the quality of component development through component functional testing of the component code repository, and stores the component code repository that has passed functional testing for easy reuse in the future.

[0099] Step S405: Transform the component code library that has passed the component functional test to generate component links corresponding to the component code library.

[0100] In this embodiment, Figure 4 Step S405 and Figure 1 The steps in step S103 are similar and will not be repeated here for the sake of simplicity.

[0101] Step S406: Include component links in the web page framework and use the Vue framework library's Render function to generate the web page.

[0102] In this embodiment, Figure 4 Step S406 and Figure 1 Step S104 is similar and will not be repeated here for the sake of simplicity.

[0103] The Web page development method of the fourth embodiment of the present invention, based on the first embodiment, can improve the quality of component development by testing the component function of the component code library, and at the same time store the component code library that has passed the component function test, so as to facilitate the subsequent reuse of the component code library.

[0104] Figure 5 This is a schematic diagram of the structure of a web page development apparatus according to an embodiment of the present invention. Figure 5 As shown, the device 50 includes a calling module 51, a page frame generation module 52, a component link generation module 53, and a page generation module 54.

[0105] The calling module 51 is used to receive Web page development requests and, in response to the Web page development requests, call the pre-built business code library and the pre-built component code library;

[0106] Page frame generation module 52 is used to generate web page frames based on the business code library;

[0107] The component link generation module 53 is used to transform the component code library and generate component links corresponding to the component code library;

[0108] The page generation module 54 is used to import component links into the web page framework and generate web pages using the Render function of the Vue framework library.

[0109] Furthermore, the device 50 also includes a release module, which, upon receiving a deletion request for a component object, releases the binding relationship between the Window object and the component object in response to the deletion request.

[0110] Furthermore, the device 50 also includes a replacement module, which, upon receiving a replacement request for a component object, responds to the replacement request by releasing the binding relationship between the Window object and the component object; obtaining a new component object and attaching the new component object to the Window object, thereby establishing a binding relationship between the Window object and the new component object.

[0111] Furthermore, the device 50 also includes a testing module, which is used to deploy the component code library to the test environment to obtain the online environment address; import the online environment address into the business code library and perform component functional testing.

[0112] Please see Figure 6 , Figure 6 This is a schematic diagram of the structure of a computer device according to an embodiment of the present invention. Figure 6 As shown, the computer device 60 includes a processor 61 and a memory 62 coupled to the processor 61.

[0113] The memory 62 stores program instructions for implementing the Web page development method described in any of the above embodiments.

[0114] The processor 61 is used to execute program instructions stored in the memory 62 to develop web pages.

[0115] The processor 61 can also be referred to as a CPU (Central Processing Unit). The processor 61 may be an integrated circuit chip with signal processing capabilities. The processor 61 can also be a general-purpose processor, a digital signal processor (DSP), an application-specific integrated circuit (ASIC), an off-the-shelf programmable gate array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components. A general-purpose processor can be a microprocessor or any conventional processor.

[0116] See Figure 7 , Figure 7 This is a schematic diagram of the structure of a computer storage medium according to an embodiment of the present invention. The computer storage medium of this embodiment stores a program file 71 capable of implementing all the above methods. This program file 71 can be stored in the computer storage medium in the form of a software product, including several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) or processor to execute all or part of the steps of the methods described in the various embodiments of the present invention. The aforementioned computer storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks, or terminal devices such as computers, servers, mobile phones, and tablets.

[0117] In the embodiments provided by this invention, it should be understood that the disclosed systems, apparatuses, and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces, indirect coupling or communication connection between apparatuses or units, and may be electrical, mechanical, or other forms.

[0118] Furthermore, the functional units in the various embodiments of the present invention can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.

[0119] The above are merely embodiments of the present invention and do not limit the patent scope of the present invention. Any equivalent structural or procedural transformations made based on the content of the present invention's specification and drawings, or direct or indirect applications in other related technical fields, are similarly included within the patent protection scope of the present invention.

Claims

1. A method of Web page development, characterized by, include: Receive a web page development request, and in response to the web page development request, invoke a pre-built business code library and a pre-built component code library; Generate a web page framework based on the aforementioned business code library; The component code library is transformed to generate component links corresponding to the component code library; The component link is introduced into the web page framework, and the web page is generated using the Render function of the Vue framework library; The step of converting the component code library to generate component links corresponding to the component code library further includes: The component codebase is bundled using Webpack to generate the corresponding SDK package; The SDK package is published to the server, and a link to the component corresponding to the component code library is generated. The step of introducing the component link into the web page framework and generating the web page using the Vue framework library's Render function includes: The component link is included in the web page framework, and the SDK package corresponding to the component link is called. The Vue framework library's Render function instantiates a component object based on the SDK package and attaches the component object to the Window object, thereby obtaining the binding relationship between the Window object and the component object; Based on Vuex state management, a Store object is generated according to the Web page framework and the Store object is attached to the Window object to obtain the binding relationship between the Window object and the Store object; The web page is generated based on the binding relationship between the Window object and the component object, and the binding relationship between the Window object and the Store object.

2. The Web page development method of claim 1, wherein, After using the Vue framework library's Render function to instantiate a component object based on the SDK package and attach the component object to the Window object to obtain the binding relationship between the Window object and the component object, the process further includes: When a deletion request for the component object is received, the binding relationship between the Window object and the component object is released in response to the deletion request.

3. The Web page development method according to claim 1, characterized in that, After using the Vue framework library's Render function to instantiate a component object based on the SDK package and attach the component object to the Window object to obtain the binding relationship between the Window object and the component object, the process further includes: When a replacement request for the component object is received, in response to the replacement request, the binding relationship between the Window object and the component object is released; Obtain a new component object and attach the new component object to the Window object, establishing a binding relationship between the Window object and the new component object.

4. The Web page development method according to claim 1, characterized in that, Before responding to the web page development request by invoking the pre-built business code library and the pre-built component code library, the method further includes: Determine if a pre-built component code library exists; If so, then the step of invoking the pre-built component code library in response to the web page development request is performed; If not, then notify the user to build and store the component code library, and perform the step of calling the pre-built component code library in response to the web page development request.

5. The Web page development method according to claim 1, characterized in that, Before performing the conversion process on the component code library to generate component links corresponding to the component code library, the method further includes: Deploy the component codebase to the test environment to obtain the online environment address; The online environment address is imported into the business codebase, and component functionality is tested. The step of converting the component code library to generate component links corresponding to the component code library includes: The component codebase that has passed the component functional test is transformed to generate a component link corresponding to the component codebase.

6. A web page development apparatus, characterized in that, include: The calling module is used to receive web page development requests and, in response to the web page development requests, call the pre-built business code library and the pre-built component code library; A page frame generation module is used to generate a web page frame based on the business code library; The component link generation module is used to transform the component code library and generate component links corresponding to the component code library. The page generation module is used to import the component link into the web page framework and generate the web page using the Render function of the Vue framework library; The step of converting the component code library to generate component links corresponding to the component code library further includes: The component codebase is bundled using Webpack to generate the corresponding SDK package; The SDK package is published to the server, and a link to the component corresponding to the component code library is generated. The step of introducing the component link into the web page framework and generating the web page using the Vue framework library's Render function includes: The component link is included in the web page framework, and the SDK package corresponding to the component link is called. The Vue framework library's Render function instantiates a component object based on the SDK package and attaches the component object to the Window object, thereby obtaining the binding relationship between the Window object and the component object; Based on Vuex state management, a Store object is generated according to the Web page framework and the Store object is attached to the Window object to obtain the binding relationship between the Window object and the Store object; The web page is generated based on the binding relationship between the Window object and the component object, and the binding relationship between the Window object and the Store object.

7. A computer device, comprising: A memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that the processor, when executing the computer program, implements the Web page development method as described in any one of claims 1-5.

8. A computer storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the Web page development method as described in any one of claims 1-5.

Images