A method and device for generating page code

Abstract

The present invention discloses a method and device for generating page code, and relates to the field of computer technology. A specific implementation of the method includes: being able to obtain a corresponding component library and a component according to an original page designed by a designer, and using a first format text to describe the component, determining a corresponding second format text according to a setting text contained in the first format text, and generating a component code based on the first format text and the second format text; generating a page according to the component code, and calculating the matching degree between the page and the original page, and determining the target code of the generated page according to a set matching degree threshold. Because different component libraries are selected, including a customized component library, the flexibility and scalability of the generated page are improved; by generating a page code according to the designed page and calculating a matching value, the development time of the project is shortened and the development efficiency is improved.

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a method and device for generating page codes. Background Art

[0002] With the rapid development of Internet technology, in the development process of Internet applications, it is necessary to carry out efficient and high-quality iterative development according to new requirements. The current development process is that the user page designer first designs the product page, and then the developer develops according to the designed page; finally, the page designer performs restoration verification on the developed page, forming a serial workflow. When the interface is changed repeatedly and the number of times is large, the project time is extended and the workload of designers and developers is increased. In development, some tools may also be used to realize the conversion from page design draft to code, but the implemented code is mostly based on the basic tags of the document object model, and cannot generate code containing custom tags, extensible, maintainable, and used for secondary development.

[0003] In the process of implementing the present invention, the inventors found that there are at least the following problems in the prior art:

[0004] In the development process, developers need to write page codes according to the design drafts of page designers. The development cycle is long due to the dependency of the development sequence. In addition, page designers need to spend time verifying the restoration degree of the page. At the same time, developers modify the code based on the verification results of page designers, which prolongs the development time of the project and increases the workload of page designers and developers. The method of implementing code based on page design drafts using existing tools lacks flexibility and scalability because it cannot generate custom tags, extensible, and maintainable code. Summary of the invention

[0005] In view of this, an embodiment of the present invention provides a method and device for generating page code, which can obtain the corresponding component library and components according to the original page designed by the designer, and use the first format text to describe the component, determine the corresponding second format text according to the setting text contained in the first format text, and generate component code based on the first format text and the second format text; generate a page according to the component code, and calculate the matching value between the page and the original page, and determine the target code of the generated page according to the set threshold. Because different component libraries are selected, including customized component libraries, the flexibility and scalability of generating pages are improved; by generating page codes according to the designed pages and calculating matching values, the development time of the project is shortened and the development efficiency is improved.

[0006] To achieve the above-mentioned purpose, according to one aspect of an embodiment of the present invention, a method for generating page code is provided, characterized in that it includes: according to the designed original page, obtaining the component corresponding to the original page in the component library, the identifier of the component library and the identifier of the component contain the same setting text; generating a component text that describes the component using a first format, the component type defined by the component text contains the setting text; based on the setting text, determining an intermediate text that defines a second format; based on the component text and the intermediate text, generating a component code; based on the component code, generating a target page, and when the matching value between the target page and the original page is not less than a set threshold, using the component code as the target code for the generated page.

[0007] Optionally, the method for generating a page code is characterized in that:

[0008] The first format is a JSON structure.

[0009] Optionally, the method for generating a page code is characterized in that:

[0010] According to the set text, the matching intermediate text is searched.

[0011] Optionally, the method for generating a page code is characterized in that:

[0012] When the intermediate text matching the set text is found, the second format is associated with the component type.

[0013] Optionally, the method for generating a page code is characterized in that:

[0014] When the intermediate text matching the set text does not exist, a predefined text is used as the intermediate text, wherein the predefined text defines the second format.

[0015] Optionally, the method for generating a page code is characterized in that:

[0016] When the matching value between the target page and the original page is less than a set threshold, the intermediate text is modified, and a component code is generated based on the component text and the modified intermediate text.

[0017] Optionally, the method for generating a page code is characterized in that:

[0018] Based on the component code, the business code corresponding to the component is changed to generate the target code of the page.

[0019] To achieve the above object, according to a second aspect of an embodiment of the present invention, a device for generating page code is provided, characterized in that it comprises: a component acquisition module, a component text generation module and a target code generation module; wherein:

[0020] The component acquisition module is used to acquire the component corresponding to the original page in the component library according to the designed original page, and the identifier of the component library and the identifier of the component contain the same setting text;

[0021] The component text generation module is used to generate a component text that describes the component in a first format, wherein the component type defined by the component text includes the setting text; based on the setting text, determine an intermediate text that defines a second format;

[0022] The target code generation module is used to generate component codes based on the component text and the intermediate text; generate a target page based on the component code, and when the matching value between the target page and the original page is not less than a set threshold, use the component code as the target code for the generated page.

[0023] Optionally, the device for generating a page code is characterized in that:

[0024] The first format is a JSON structure.

[0025] Optionally, the device for generating a page code is characterized in that:

[0026] According to the set text, the matching intermediate text is searched.

[0027] Optionally, the device for generating a page code is characterized in that:

[0028] When the intermediate text matching the set text is found, the second format is associated with the component type.

[0029] Optionally, the device for generating a page code is characterized in that:

[0030] When the intermediate text matching the set text does not exist, a predefined text is used as the intermediate text, wherein the predefined text defines the second format.

[0031] Optionally, the device for generating a page code is characterized in that:

[0032] When the matching value between the target page and the original page is less than a set threshold, the intermediate text is modified, and a component code is generated based on the component text and the modified intermediate text.

[0033] Optionally, the device for generating a page code is characterized in that:

[0034] Based on the component code, the business code corresponding to the component is changed to generate the target code of the page.

[0035] To achieve the above-mentioned purpose, according to a third aspect of an embodiment of the present invention, there is provided an electronic device for generating a page code, characterized in that it comprises: one or more processors; a storage device for storing one or more programs, and when the one or more programs are executed by the one or more processors, the one or more processors implement any of the methods described in the above-mentioned methods for generating a page code.

[0036] To achieve the above objective, according to a fourth aspect of an embodiment of the present invention, a computer-readable medium is provided, on which a computer program is stored, wherein when the program is executed by a processor, any method described in the above method for generating a page code is implemented.

[0037] One embodiment of the above invention has the following advantages or beneficial effects: it is able to obtain components in the corresponding component library according to the original page designed by the designer, and use the first format text to describe the component, determine the corresponding second format text according to the setting text contained in the first format text, and generate component code based on the first format text and the second format text; generate a page according to the component code, and calculate the matching degree between the page and the original page, and determine the component code of the generated page according to the set matching degree threshold. Because different component libraries are selected, including customized component libraries, the flexibility and scalability of the generated page are improved; by generating page code according to the designed page and calculating the matching value, the project development time is shortened and the development efficiency is improved.

[0038] The further effects of the above-mentioned non-conventional optional manner will be described below in conjunction with the specific implementation manner. BRIEF DESCRIPTION OF THE DRAWINGS

[0039] The accompanying drawings are used to better understand the present invention and do not constitute an improper limitation of the present invention.

[0040] Figure 1 It is a flowchart of a method for generating page code provided by an embodiment of the present invention;

[0041] Figure 2 It is a schematic diagram of a flow chart of generating a page code provided by an embodiment of the present invention;

[0042] Figure 3A is an example diagram of a component text provided by an embodiment of the present invention;

[0043] Figure 3Bis an example diagram of a second format text provided by an embodiment of the present invention;

[0044] Figure 3C is an example diagram of a component code provided by an embodiment of the present invention;

[0045] Figure 4 It is a structural schematic diagram of a device for generating page codes provided by an embodiment of the present invention;

[0046] Figure 5 is an exemplary system architecture diagram to which embodiments of the present invention may be applied;

[0047] Figure 6 It is a schematic diagram of the structure of a computer system of a terminal device or a server suitable for implementing an embodiment of the present invention. DETAILED DESCRIPTION

[0048] The following is a description of exemplary embodiments of the present invention in conjunction with the accompanying drawings, including various details of the embodiments of the present invention to facilitate understanding, which should be considered as merely exemplary. Therefore, it should be recognized by those of ordinary skill in the art that various changes and modifications may be made to the embodiments described herein without departing from the scope and spirit of the present invention. Similarly, for clarity and conciseness, the description of well-known functions and structures is omitted in the following description.

[0049] like Figure 1 As shown, an embodiment of the present invention provides a method for generating a page code, which may include the following steps:

[0050] Step S101: according to the designed original page, obtain the component corresponding to the original page in the component library, and the identifier of the component library and the identifier of the component contain the same setting text.

[0051] Specifically, usually in the development process of developing an application, firstly, a designer needs to design a page of an application or a webpage (i.e., an original page). The page may contain one or more components, and the components may be of various types, such as image, view, text, button, etc. It is understandable that when the designer designs the original page, it may also be designed according to the style and style of the components contained in the component library; further, according to the designed original page, the components in the component library are obtained, and the component library is customized according to the style of the application, or it may be a component library obtained from a third party; wherein the identifier of the component library and the identifier of the component contain the same setting text. The setting text may be a prefix of the identifier of the component library or the component identifier, or a suffix of the identifier of the component library or the component identifier, or text in other positions, for example, the identifier of the component library is AAA-lib, and the component identifiers it contains are AAA-Button, AAA-Text, etc.; wherein AAA is the setting text, and it is understandable that the association between the component library and each component is established by the identifier of the component library and the identifier of the component containing the same setting text, so as to further generate the first format text.

[0052] The present invention does not limit the specific content and style of the component library, the component library identifier, the component identifier, and the specific content of the setting text.

[0053] Step S102: Generate a component text that describes the component in a first format, wherein the component type defined by the component text includes the setting text; and determine an intermediate text that defines a second format based on the setting text.

[0054] Specifically, according to the description of step S101, a component in the component library is obtained, and a component text is generated according to the obtained component. The component text is described in a first format, for example, the first format is a JSON structure, that is, the first format is a JSON structure. The following uses a button component as an example to illustrate a component text described in a JSON structure (that is, the first format). Figure 3A As shown; wherein, type is the component type, and its content is AAA-button. It is assumed that the component is obtained from the component library AAA-lib, and AAA is the set text; further, props indicates the properties of the component, including custom properties such as id, type1, innerText, etc. The present invention does not limit the specific content of the component text.

[0055] Further, according to the setting text, an intermediate text with a second format defined is determined. The second format is a set domain-specific language format. Specifically, still taking the setting text "AAA" as an example, the following is combined with Figure 3B The middle text shown in the figure is used as an example to illustrate this step. Figure 3BAs shown, the intermediate text described in the second format is searched and determined according to 'AAA' (AAA is the set text) in type.indexOf('AAA'), that is, the matching intermediate text is searched according to the set text. The second format is a custom domain-specific language format, and custom tags can be defined according to the requirements of page design; when the intermediate text matching 'AAA' is found, the following is executed Figure 3B The step described in B301, wherein ${type} indicates a component type; that is, when the intermediate text matching the set text is found, the second format is related to the component type.

[0056] Further, when there is no intermediate text matching the set text, a predefined text is used as the intermediate text, wherein the predefined text defines the second format. Specifically, when there is no intermediate text matching the set text, the method described in the following example is used. Figure 3B The step described in B302, wherein the predefined text defines the second format, preferably, the predefined format can be a format containing DOM (Document Object Model, Document Object Model) tags. An example is that the intermediate text described in B302 is '<div${classString}${props}> ${transform(schema.children)}>';<div…> and are examples of DOM tags.

[0057] Step S103: Generate component codes based on the component text and the intermediate text; generate a target page based on the component code, and when the matching value between the target page and the original page is not less than a set threshold, use the component code as the target code of the generated page.

[0058] Specifically, still taking the component text example in step S101 (such as Figure 3A ), and the intermediate text example in step S102 (as shown Figure 3B As shown in this step, component code is generated based on component text and intermediate text. An example of component code is as follows Figure 3C As shown, it can be understood that the content of the component text is read through the business logic containing the intermediate text, and the component code is further generated based on Figure 3A Component text examples, and Figure 3B The intermediate text example shown in B301 in the figure, the generated button component code is as follows Figure 3C As shown; among them, Figure 3C The C301 shown is the "AAA-button" in the component code, which is Figure 3AThe type in is also based on Figure 3B "${type}" in ; Figure 3C The C302 "class="aaa-bbb-ccc"" shown is Figure 3A The "type":"AAA-button" in the same way is also based on Figure 3B "${classString}" in Figure 3C The C303 "id="button-1"" shown is Figure 3A The id contained in props; also based on Figure 3B "${props}" in ; Figure 3C The C304 "type1="primary"" shown is Figure 3A The type1 contained in props in is also based on Figure 3B "${props}" in ; Figure 3C The C305 "innerText = "button 1"" shown is Figure 3A The innerText contained in props; also based on Figure 3B "${props}" in ; Figure 3C The C306 shown corresponds to Figure 3A The type in is based on Figure 3B '>${transform(schema.children)}< / ${type}> ',visible Figure 3C The information in the component code shown comes from Figure 3A The component text shown follows the language format Figure 3B The intermediate text shown in FIG. That is, based on the component text and the intermediate text, a component code is generated.

[0059] Further, a target page is generated according to the generated component code; it is understandable that the target page can be displayed through a browser, and a matching value between the generated target page and the designed original page is further calculated. When the matching value is greater than a set threshold (e.g., 95%), the generated component code is used as the target code for the generated page. Since the rendering of the target page will be based on the information in the component text (e.g., Figure 3A The "props" part in the component text is related to the requirements of the original page, so the matching value can be calculated by comparing the images of the target page and the original page. The present invention does not limit the specific method for calculating the matching value of the target page and the original page.

[0060] It is understandable that the above example is based on a button component. A page can contain multiple components. The component codes of each component are generated according to similar steps, and the target code of the page is generated by assembling the component codes. Further, the page is generated according to the target code, and the matching value between the generated target page and the designed original page is calculated. When the matching value is greater than a set threshold (for example, 95%), the generated component code is used as the target code of the generated page.

[0061] Furthermore, when the matching value between the target page and the original page is less than a set threshold, the intermediate text is modified, and a new component code is generated by modifying the intermediate text (i.e., text based on a domain-specific language format), a new page is generated according to the new component code, and the matching value between the new page and the original page is further calculated. It can be understood that by calculating the matching value between the target page and the original page multiple times and then modifying the intermediate text, the workload of page designers and developers is reduced.

[0062] Furthermore, based on the component code, the business code corresponding to the component is changed to generate the target code of the page. Specifically, based on the generated component code, the business logic code related to the component is changed (may be added, modified, deleted). For example, the various businesses executed by pressing a button are changed (added, modified, deleted), etc. The generated target code is placed in the project used for development to complete the development of the application associated with the page.

[0063] Preferably, a visualization platform can be built based on the method described in step S101 to step S103, with the input being the designed original page file and the output being the target code to assist in the development of the application of the page.

[0064] like Figure 2 As shown, an embodiment of the present invention provides a method for generating a page code, which may include the following steps:

[0065] Step S201: Obtain the design draft of the original page.

[0066] Specifically, the description of the designer designing the original page and obtaining the design draft of the original page is consistent with step S101 and will not be repeated here.

[0067] Step S202: Determine a component library according to the design draft, and obtain components in the component library.

[0068] Specifically, the description of determining the component library according to the design draft of the original page and obtaining the components included in the component library is consistent with step S101 and will not be repeated here.

[0069] Step S203: Generate the first format text of each component.

[0070] Specifically, the description of generating the first format (ie, JSON structure) text (ie, component text) based on the component is consistent with step S102 and will not be repeated here.

[0071] Step S204: Determine the corresponding second format text.

[0072] Specifically, the description of determining the second format text (ie, the intermediate text) according to the set text included in the component identifier is consistent with step S102 and will not be repeated here.

[0073] Step S205: Generate component code.

[0074] Specifically, the description of generating the component code based on the component text described in step S203 and the intermediate text described in step S204 is consistent with step S103 and will not be repeated here.

[0075] Step S206: Generate a target page and calculate a matching value with the original page.

[0076] Specifically, the description of generating a page according to the component code and calculating the matching value between the target page and the original page is consistent with step S103 and will not be repeated here.

[0077] Step S207: determine whether the matching value is greater than a set threshold.

[0078] If it is greater than the set threshold, execute step S209; otherwise execute step S208. Specifically, the description of calculating the matching value between the target page and the original page is consistent with step S103, which will not be repeated here.

[0079] Step S208: Modify the second format text.

[0080] Specifically, when the matching value between the target page and the original page is less than the set threshold, the second format text (i.e., the intermediate text) is modified, and step S204 is further executed to generate the component code again in combination with step S203, and a loop judgment is performed until the matching value between the generated target page and the original page is greater than the set threshold. That is, when the matching value between the target page and the original page is less than the set threshold, the intermediate text is modified, and the component code is generated based on the component text and the modified intermediate text.

[0081] Step S209: The component code is the target code for generating the page.

[0082] Specifically, the description of generating the target code is consistent with step S103 and will not be repeated here.

[0083] like Figure 4As shown, the embodiment of the present invention provides a device 400 for generating page code, including: a component acquisition module 401, a component text generation module 402 and a target code generation module 403; wherein,

[0084] The component acquisition module 401 is used to acquire the component corresponding to the original page in the component library according to the designed original page, and the identifier of the component library and the identifier of the component contain the same setting text;

[0085] The component text generation module 402 is used to generate a component text that describes the component in a first format, wherein the component type defined in the component text includes the setting text; based on the setting text, determine an intermediate text that defines a second format;

[0086] The target code generation module 403 is used to generate component codes based on the component text and the intermediate text; generate a target page based on the component code, and when the matching value between the target page and the original page is not less than a set threshold, use the component code as the target code for the generated page.

[0087] Optionally, the component text generation module 402 includes the first format being a JSON structure.

[0088] Optionally, the component text generation module 402 is used to search for the matching intermediate text according to the set text.

[0089] Optionally, the component text generating module 402 is configured to, when finding the intermediate text matching the set text, have the second format associated with the component type.

[0090] Optionally, the component text generation module 402 is configured to use a predefined text as the intermediate text when there is no intermediate text matching the set text, wherein the predefined text defines the second format.

[0091] Optionally, the target code generation module 403 is used to modify the intermediate text when the matching value between the target page and the original page is less than a set threshold, and generate a component code based on the component text and the modified intermediate text.

[0092] Optionally, the target code generation module 403 is used to add a business code corresponding to the component based on the component code to generate the target code of the page.

[0093] An embodiment of the present invention also provides an electronic device for generating page code, comprising: one or more processors; a storage device for storing one or more programs, when the one or more programs are executed by the one or more processors, the one or more processors implement the method provided in any of the above embodiments.

[0094] An embodiment of the present invention further provides a computer-readable medium on which a computer program is stored. When the program is executed by a processor, the method provided in any of the above embodiments is implemented.

[0095] Figure 5 An exemplary system architecture 500 is shown to which the method for generating page codes or the apparatus for generating page codes according to the embodiments of the present invention can be applied.

[0096] like Figure 5 As shown, system architecture 500 may include terminal devices 501, 502, 503, a network 504 and a server 505. Network 504 is used to provide a medium for communication links between terminal devices 501, 502, 503 and server 505. Network 504 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.

[0097] Users can use terminal devices 501, 502, 503 to interact with server 505 through network 504 to receive or send messages, etc. Terminal devices 501, 502, 503 can be installed with various client applications, such as web browser applications, search applications, instant messaging tools, and email clients.

[0098] The terminal devices 501 , 502 , and 503 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop computers, desktop computers, and the like.

[0099] Server 505 may be a server that provides various services, such as a background management server that provides support for pages designed by users using terminal devices 501, 502, and 503. The background management server may process and generate codes for the received page design drafts, and feed back the pages generated according to the codes to the terminal devices.

[0100] It should be noted that the method for generating a page code provided in the embodiment of the present invention is generally executed by the server 505 , and accordingly, the device for generating a page code is generally disposed in the server 505 .

[0101] It should be understood that Figure 5 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to the implementation requirements.

[0102] Reference below Figure 6 , which shows a schematic diagram of the structure of a computer system 600 of a terminal device suitable for implementing an embodiment of the present invention. Figure 6 The terminal device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present invention.

[0103] like Figure 6 As shown, the computer system 600 includes a central processing unit (CPU) 601, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 602 or a program loaded from a storage part 608 into a random access memory (RAM) 603. In the RAM 603, various programs and data required for the operation of the system 600 are also stored. The CPU 601, the ROM 602, and the RAM 603 are connected to each other via a bus 604. An input / output (I / O) interface 605 is also connected to the bus 604.

[0104] The following components are connected to the I / O interface 605: an input section 606 including a keyboard, a mouse, etc.; an output section 607 including a cathode ray tube (CRT), a liquid crystal display (LCD), etc., and a speaker, etc.; a storage section 608 including a hard disk, etc.; and a communication section 609 including a network interface card such as a LAN card, a modem, etc. The communication section 609 performs communication processing via a network such as the Internet. A drive 610 is also connected to the I / O interface 605 as needed. A removable medium 611, such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc., is installed on the drive 610 as needed, so that a computer program read therefrom is installed into the storage section 608 as needed.

[0105] In particular, according to the embodiments disclosed in the present invention, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present invention include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network through the communication part 609, and / or installed from the removable medium 611. When the computer program is executed by the central processing unit (CPU) 601, the above-mentioned functions defined in the system of the present invention are executed.

[0106] It should be noted that the computer-readable medium shown in the present invention may be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present invention, a computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in combination with an instruction execution system, device or device. In the present invention, a computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, which carries a computer-readable program code. This propagated data signal may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. Computer-readable signal media may also be any computer-readable medium other than computer-readable storage media, which may send, propagate or transmit a program for use by or in conjunction with an instruction execution system, apparatus or device. The program code contained on the computer-readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, optical cable, RF, etc., or any suitable combination of the above.

[0107] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present invention. In this regard, each box in the flow chart or block diagram can represent a module, a program segment, or a part of a code, and the above-mentioned module, program segment, or a part of a code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order from the order marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram or flow chart, and the combination of the boxes in the block diagram or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0108] The modules and / or units involved in the embodiments of the present invention may be implemented in software or hardware. The modules and / or units described may also be arranged in a processor, for example, they may be described as: a processor includes a component acquisition module, a component text generation module, and a target code generation module. The names of these modules do not constitute a limitation on the modules themselves in certain cases, for example, the component acquisition module may also be described as "determining the component library and component module to be used according to the original page of the design".

[0109] As another aspect, the present invention also provides a computer-readable medium, which may be included in the device described in the above embodiment; or may exist independently and not be assembled into the device. The above computer-readable medium carries one or more programs, and when the above one or more programs are executed by a device, the device includes: according to the designed original page, obtaining the component corresponding to the original page in the component library, the identifier of the component library and the identifier of the component contain the same setting text; generating a component text describing the component using a first format, the component type defined by the component text contains the setting text; based on the setting text, determining the intermediate text defining the second format; based on the component text and the intermediate text, generating a component code; based on the component code, generating a target page, and when the matching value between the target page and the original page is not less than a set threshold, using the component code as the target code of the generated page. According to the technical solution of the embodiment of the present invention, it is possible to obtain components in the corresponding component library according to the original page designed by the designer, and use the first format text to describe the component, determine the corresponding second format text according to the setting text contained in the first format text, and generate component code based on the first format text and the second format text; generate a page according to the component code, and calculate the matching degree between the page and the original page, and determine the component code of the generated page according to the set matching degree threshold. Because different component libraries are selected, including customized component libraries, the flexibility and scalability of generating pages are improved; by generating page codes according to the designed pages and calculating the matching degree, the development time and workload are reduced, and the development efficiency is improved.

[0110] The above specific implementations do not constitute a limitation on the protection scope of the present invention. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions may occur depending on design requirements and other factors. Any modification, equivalent substitution and improvement made within the spirit and principle of the present invention shall be included in the protection scope of the present invention.

Claims

1. A method for generating a page code, characterized in that: include: According to the designed original page, a component corresponding to the original page in a component library is obtained, wherein the identifier of the component library and the identifier of the component contain the same setting text; Generate a component text that describes the component in a first format, wherein the component type defined by the component text includes the setting text; Based on the set text, determining an intermediate text defining a second format; Based on the component text and the intermediate text, a component code is generated; Based on the component code, generate a target page; When the image matching value between the image of the target page displayed in the browser and the design draft image of the original page is not less than a set threshold, the component code is used as the target code for the generated page; otherwise, the intermediate text is modified, and the component code is regenerated based on the component text and the modified intermediate text.

2. The method according to claim 1, characterized in that The first format is a JSON structure.

3. The method according to claim 1, characterized in that According to the set text, the matching intermediate text is searched.

4. The method according to claim 3, characterized in that When the intermediate text matching the set text is found, the second format is associated with the component type.

5. The method according to claim 3, characterized in that: When the intermediate text matching the set text does not exist, a predefined text is used as the intermediate text, wherein the predefined text defines the second format.

6. The method according to any one of claims 1 to 5, characterized in that: Based on the component code, the business code corresponding to the component is changed to generate the target code of the page.

7. A device for generating a page code, characterized in that: include: Component acquisition module, component text generation module and target code generation module; wherein, The component acquisition module is used to acquire the component corresponding to the original page in the component library according to the designed original page, and the identifier of the component library and the identifier of the component contain the same setting text; The component text generation module is used to generate a component text that describes the component in a first format, wherein the component type defined by the component text includes the setting text; based on the setting text, determine an intermediate text that defines a second format; The target code generation module is used to generate a component code based on the component text and the intermediate text; generate a target page based on the component code; when the matching value between the image of the target page displayed in the browser and the image of the design draft of the original page is not less than a set threshold, use the component code as the target code for the generated page; otherwise, modify the intermediate text, and regenerate the component code based on the component text and the modified intermediate text.

8. An electronic device, characterized in that: include: one or more processors; a storage device for storing one or more programs, When the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 6.

9. A computer readable medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method according to any one of claims 1 to 6 is implemented.

Images