WO2023087720A1

WO2023087720A1 - Applet generation method and apparatus, device and storage medium

Info

Publication number: WO2023087720A1
Application number: PCT/CN2022/102158
Authority: WO
Inventors: 朱桂锋; 林挺
Original assignee: 深圳前海微众银行股份有限公司
Priority date: 2021-11-16
Filing date: 2022-06-29
Publication date: 2023-05-25
Also published as: CN114064003A

Abstract

The present application provides an applet generation method and apparatus, a device and a storage medium. The method comprises: reading a VUE component by using a preset asynchronous reading tool to obtain component files in the VUE component, the component files each comprising a page file, a JS file and a CSS file; correspondingly storing codes in the component files in temporary files, the temporary files each comprising a WXML temporary file, a JS temporary file and a WXSS temporary file; converting codes in each temporary file according to a preset conversion policy to obtain applet component files, completing the conversion from the VUE component to an applet component, and generating an applet according to the applet component files. The applet component is obtained by performing conversion on the basis of the preset conversion policy, thus effectively improving the efficiency of obtaining applet components and generating an applet, enabling the granularity of modifiable content to be smaller, thus ensuring the correctness of the applet components, and the correspondence between codes before and after modification may be known, which facilitates subsequent maintenance.

Description

Small program generation method, device, equipment and storage medium

This application claims the priority of a Chinese patent application with application number 202111358314.5 and application title "Machine Program Generation Method, Apparatus, Equipment, and Storage Medium" filed with the China Patent Office on November 16, 2021, the entire contents of which are incorporated by reference in this application.

technical field

The present application relates to the field of computer technology, and in particular to a small program generation method, device, equipment and storage medium.

Background technique

WeChat applets, or applets for short, are applications that can be used without downloading and installing. Users can open the application by scanning or searching, which embodies an instant usage concept and is widely used. Currently, applets cannot load content such as HTML (Hyper Text Markup Language) pages, and these HTML pages need to be able to be opened during the use of the applet, so it needs to be used according to the existing HTML pages. The component generates applet components.

HTML pages can be formed using VUE components, and the file content of VUE components includes HTML template files, JavaScript (JS) files, and Cascading Style Sheets (Cascading Style Sheets, CSS) files. Currently, there are two ways to obtain applet components based on VUE components. One is to manually replace each single-file component in the VUE component with the corresponding component required by the applet, and create a new applet JSON (JavaScript Object Notation) configuration file. The other is to replace VUE components with applet components through regular expressions.

However, the above two existing methods have defects. For example, the manual replacement method is inefficient, cannot guarantee the correctness of the replacement result, and requires manual inspection. The position of the replaced code is difficult to record, resulting in a lack of correspondence between the codes before and after the replacement. Therefore, in the subsequent modification and maintenance stage, it is necessary to rely on manual positioning of the location of the error. When an error occurs at the grammatical level, there is a lack of tool assistance, resulting in repeated development of the same function. The way of replacing by regular expressions is rough and general for code processing, and it takes a long time to locate the problem, and when encountering long strings, the efficiency of regular expressions is relatively low. It can be seen that there is an urgent need for a method for generating applets to overcome the above-mentioned technical defects in the existing technology of generating applet components based on VUE components.

technical solution

The present application provides a small program generation method, device, device and storage medium, which are used to provide a small program generation method to overcome the existing technical defects of replacing VUE components by manual replacement or regular expression replacement.

In the first aspect, the present application provides a method for generating a small program, including:

Utilize preset asynchronous reading tool to read VUE component, obtain each component file in described VUE component, described each component file comprises page file, JS file and cascading style sheet CSS file;

The codes in each of the component files are correspondingly stored in each temporary file respectively, and each of the temporary files includes a Wechat markup language WXML temporary file, a JS temporary file and a Wechat Cascading Style Sheet WXSS temporary file;

Convert the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files to generate applets according to the applet component files. The preset conversion strategy includes traversing each abstract syntax tree Each node of each node is modified to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed for the code in each temporary file.

In a possible design, the codes in each temporary file are converted according to the preset conversion strategy to obtain corresponding applet component files, including:

converting the code in the WXML temporary file according to a first preset conversion rule to generate a WXML target file;

converting the code in the JS temporary file according to the second preset conversion rule to generate the JS target file;

converting the code in the WXSS temporary file according to a third preset conversion rule to generate a WXSS target file;

Wherein, the preset conversion policy includes the first preset conversion rule, the second preset conversion rule, and the third preset conversion rule, and the applet component files include the WXML target file, The JS target file and the WXSS target file.

In a possible design, the code in the WXML temporary file is converted according to a first preset conversion rule to generate a WXML target file, including:

Using the preset asynchronous reading tool to read the WXML temporary file to obtain the code in the WXSS temporary file;

Using a page parser to parse the code in the WXML temporary file to obtain a first abstract syntax tree, the first abstract syntax tree including a description of all content in the page file;

Modifying the first abstract syntax tree according to the first preset conversion rule to obtain a first target abstract syntax tree;

Generate a first object code according to the first object abstract syntax tree, and obtain the WXML object file according to the first object code.

In a possible design, the modifying the first abstract syntax tree according to the first preset conversion rule to obtain the first target abstract syntax tree includes:

Traversing the first abstract syntax tree to obtain a form tag, and replacing the tag content in the form tag according to a preset tag mapping table;

modifying the target node of the first abstract syntax tree according to a format modification rule;

determining the first abstract syntax tree that has been replaced by the preset label mapping table and modified by the format modification rule as the first target abstract syntax tree;

Wherein, the first preset conversion rule includes the preset tag mapping table and the format modification rule.

In a possible design, the format modification rules include:

modifying the column rendering format in the first abstract syntax tree to the applet list rendering format;

modifying the conditional rendering format in the first abstract syntax tree to the applet conditional rendering format;

The event binding format in the first abstract syntax tree is modified to the applet event binding format.

In a possible design, the code in the JS temporary file is converted according to the second preset conversion rule to generate a JS target file, including:

Using the preset asynchronous reading tool to read the JS temporary file to obtain the code in the JS temporary file;

Parsing the code in the JS temporary file by using the parsing plug-in to obtain a second abstract syntax tree, the second abstract syntax tree including a description of all content in the JS file;

Modifying the second abstract syntax tree according to the second preset conversion rule to obtain a second target abstract syntax tree;

Generate a second object code according to the second object abstract syntax tree, and obtain the JS object file according to the second object code.

In a possible design, modifying the second abstract syntax tree according to the second preset conversion rule to obtain a second target abstract syntax tree includes:

Traversing the second abstract syntax tree, modifying target nodes of the second abstract syntax tree according to attribute modification rules to obtain the second target abstract syntax tree, wherein the second preset conversion rules include the attribute modification rules.

In a possible design, the attribute modification rules include:

Obtain the attributes and values of the return function, and use the attributes and values of the return function to replace the return data of the return function to modify the definition of the data attribute in the second abstract syntax tree, and the return data of the return function is modified The definition of the data attribute in the aforementioned second abstract syntax tree;

modifying the definition of the props attribute in the second abstract syntax tree and the definition of the corresponding default attribute value to the definition of the target attribute and the definition of the target, the definition of the target attribute and the definition of the target meet the attributes of the applet define requirements;

modifying the data reading mode of the second abstract syntax tree to a target reading mode, and the target reading mode satisfies the life cycle hook function of the applet;

Modifying the assignment expression in the second abstract syntax tree to the mode of executing the function of the applet.

In a possible design, the code in the WXSS temporary file is converted according to a third preset conversion rule to generate a WXSS target file, including:

Using the preset asynchronous reading tool to read the WXSS temporary file to obtain the code in the WXSS temporary file;

Using a syntax analyzer to parse the code in the WXSS temporary file to obtain a third abstract syntax tree, the third abstract syntax tree includes a description of all content in the CSS tag;

Traversing and modifying the third abstract syntax tree according to the third preset conversion rule to obtain a third target abstract syntax tree;

Generate a third object code according to the third object abstract syntax tree, and obtain the WXSS object file according to the third object code.

In a possible design, the traversing and modifying the third abstract syntax tree according to the third preset conversion rule to obtain a third target abstract syntax tree includes:

The third abstract syntax tree is traversed, and the third abstract syntax tree is modified according to the selector modification rule to obtain the third target abstract syntax tree, and the third preset conversion rule includes the selector modification rule.

In a possible design, the selector modification rule includes:

modifying the unit of measure declared by the target selector in the third abstract syntax tree to a target unit of measure, the target unit of measure meeting the self-adaptive size unit of the applet;

Logging is used to record limited selectors, the limited selectors being any selectors not supported by the applet in the third abstract syntax tree.

In a possible design, after obtaining the applet component files, it further includes:

The information file is generated according to the code in the JS target file, and the information file is used to record the position information of the code of each applet component file in the code of the VUE component.

In a possible design, before using the preset asynchronous reading tool to read the VUE component, it also includes:

A work order is generated according to the component generation requirement, and a command line tool is executed in response to the work order, and the command line tool is used to enable the applet generation method.

In a second aspect, the present application provides a small program generation device, including:

The acquisition module is used to read the VUE component using a preset asynchronous reading tool to obtain each component file in the VUE component, and each component file includes a page file, a JS file and a cascading style sheet CSS file;

The storage module is used to store the codes in each of the component files correspondingly to each temporary file respectively, and each of the temporary files includes a Wechat markup language WXML temporary file, a JS temporary file and a Wechat Cascading Style Sheet WXSS temporary file;

A processing module, configured to convert the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files, so as to generate applets according to the applet component files, and the preset conversion strategy includes traversing Each node of each abstract syntax tree is used to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed for the code in each temporary file.

In a third aspect, the present application provides an electronic device, including:

Processor; and,

a memory for storing the computer program of the processor;

Wherein, the processor is configured to implement any possible applet generating method provided in the first aspect by executing the computer program.

In a fourth aspect, the present application provides a computer-readable storage medium, on which a computer program is stored, and when the computer program is executed by a processor, any possible applet generation method provided in the first aspect is implemented.

In a fifth aspect, the present application further provides a computer program product, including a computer program, and when the computer program is executed by a processor, any possible applet generation method provided in the first aspect is implemented.

This application provides a small program generation method, device, equipment and storage medium. First, use the preset asynchronous reading tool to read the VUE component to obtain each component file in the VUE component. Each component file includes a page file, a JS file, and a cascaded Style sheet CSS file. Then the codes in each component file are correspondingly stored in each temporary file, and each temporary file includes a WeChat markup language WXML temporary file, a JS temporary file and a WeChat Cascading Style Sheet WXSS temporary file. Finally, the code in each temporary file is converted according to the preset conversion strategy to obtain the component files of each applet, and the conversion from the VUE component to the applet component is completed, and then the applet is generated according to the component files of each applet. Wherein, the preset conversion strategy includes traversing each node of each abstract syntax tree to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed by codes in each temporary file. The applet components are converted based on the preset conversion strategy, which effectively improves the efficiency of obtaining applet components and generating applets, making the granularity of modifiable content smaller, ensuring the correctness of the obtained applet components, and You can know the correspondence between codes before and after modification, which is convenient for subsequent maintenance.

Description of drawings

FIG. 1 is a schematic diagram of an application scenario provided by an embodiment of the present application;

FIG. 2 is a schematic flowchart of a method for generating a small program provided by an embodiment of the present application;

FIG. 3 is a schematic diagram of file storage provided by an embodiment of the present application;

FIG. 4 is a schematic flowchart of another applet generation method provided by the embodiment of the present application;

FIG. 5 is a schematic flowchart of another method for generating a small program provided by the embodiment of the present application;

FIG. 6 is a schematic flowchart of another applet generation method provided by the embodiment of the present application;

FIG. 7 is a schematic flowchart of another method for generating a small program provided by the embodiment of the present application;

FIG. 8 is a schematic structural diagram of a small program generation device provided by an embodiment of the present application;

FIG. 9 is a schematic structural diagram of a processing module provided in an embodiment of the present application;

FIG. 10 is a schematic structural diagram of an electronic device provided by the present application.

Embodiments of the present invention

Reference will now be made in detail to the exemplary embodiments, examples of which are illustrated in the accompanying drawings. When the following description refers to the accompanying drawings, the same numerals in different drawings refer to the same or similar elements unless otherwise indicated. The implementations described in the following exemplary embodiments do not represent all implementations consistent with this application. Rather, they are merely examples of methods and apparatus consistent with aspects of the present application as recited in the appended claims.

The terms "first", "second", "third", "fourth", etc. (if any) in the description and claims of this application and the above drawings are used to distinguish similar objects and not necessarily Describe a specific order or sequence. It is to be understood that the data so used are interchangeable under appropriate circumstances such that the embodiments of the application described herein, for example, can be practiced in sequences other than those illustrated or described herein. Furthermore, the terms "comprising" and "having", as well as any variations thereof, are intended to cover a non-exclusive inclusion, for example, a process, method, system, product or device comprising a sequence of steps or elements is not necessarily limited to the expressly listed instead, may include other steps or elements not explicitly listed or inherent to the process, method, product or apparatus.

Since the applet cannot load e.g. HTML (Hyper Text Markup Language, Hyper Text Markup Language) pages and other content, and these HTML pages need to be able to be opened during the use of the applet, so it is necessary to generate applet components based on the components used by the existing HTML pages. HTML pages can be formed using VUE components, which include HTML templates, JavaScript (JS) components, and Cascading Style Sheets (Cascading Style Sheets, CSS) components. Currently, there are two ways to obtain applet components based on VUE components. One is to manually replace each single-file component in the VUE component with the corresponding component required by the applet, and create a new applet JSON (JavaScript Object Notation) configuration file. The other is to replace VUE components with applet components through regular expressions. However, these two methods have problems such as low conversion efficiency, inability to guarantee correctness, and lack of correspondence between codes before and after replacement, which makes it difficult to locate in the maintenance phase.

In view of the above-mentioned problems existing in the prior art, this application provides a method for generating a small program. The inventive idea is to: store the codes in each component file included in the VUE component in each temporary file, and then use the preset conversion strategy to The code in each temporary file is converted to obtain corresponding applet component files, complete the conversion from VUE components to applet components, and then generate applets based on each applet component file. Wherein, since the preset conversion strategy includes traversing each node of each abstract syntax tree to modify the target node of each abstract syntax tree, and each abstract syntax tree is formed correspondingly by the codes in each temporary file, thus in this application The implementation process of converting VUE components based on the preset conversion strategy to obtain applet components makes the granularity of the modifiable content smaller, ensures the correctness of the obtained applet components, and effectively improves the process of obtaining each applet component and generating The efficiency of the applet, and the corresponding relationship between the before and after code can also be modified to facilitate subsequent code maintenance.

Hereinafter, exemplary application scenarios of the embodiments of the present application are introduced.

FIG. 1 is a schematic diagram of an application scenario provided by an embodiment of the present application. As shown in FIG. 1 , the network is used as a medium for providing a communication link between the server 11 and the terminal device 12 . A network may include various connection types such as wires, wireless communication links, or fiber optic cables, among others. The server 11 and the terminal device 12 can interact through the network to receive or send messages. Wherein, the server 11 can be configured as a corresponding electronic device that executes the applet generation method provided by the embodiment of the present application, and the terminal device 12 can run the generated applet. The applet generation method provided by the embodiment of the application is executed by the server 11 to convert the VUE components into various applet components, and then generate applets, so that the applets formed by the VUE components, such as HTML pages, can be loaded on the terminal device 12 .

The embodiment of the present application does not limit the types of the server 11 and terminal device 12 in the above description. For example, the server 11 can also be a server cluster, and the terminal device 12 can be a smart phone, smart glasses, smart bracelet, smart watch, tablet computer, etc. etc., the terminal device 12 in FIG. 1 is illustrated by taking a smart phone as an example.

It should be noted that the above application scenarios are only illustrative, and the applet generation method, device, device, and storage medium provided in the embodiments of the present application include but are not limited to the above application scenarios.

The technical solution of the present application and how the technical solution of the present application solves the above technical problems will be described in detail below with specific embodiments. The following specific embodiments may be combined with each other, and the same or similar concepts or processes may not be repeated in some embodiments. Embodiments of the present application will be described below in conjunction with the accompanying drawings.

FIG. 2 is a schematic flowchart of a method for generating a small program provided by an embodiment of the present application. As shown in Figure 2, the applet generation method provided by the embodiment of the present application includes:

S101: Read the VUE component by using a preset asynchronous reading tool to obtain each component file in the VUE component.

Wherein, each component file includes a page file, a JS file, and a cascading style sheet CSS file.

Use the preset asynchronous reading tool to read the file content of the VUE component, and get each component file in the VUE component. Among them, the VUE component is an abstract data type of view and interaction logic, which contains HTML templates, CSS styles, and JS logic code fragments. Using the vue-loader plugin of the webpack packaging tool, for example, can compile VUE components into runnable H5 code.

In the embodiment of this application, the VUE component is read by a preset asynchronous reading tool, and each component file is obtained according to its contained content, that is, the page file, JS file and CSS file of the cascading style sheet are obtained. Wherein, the page file can be understood as a file storing HTML template codes, the JS file can be understood as a file storing JS logic code fragments, and the CSS file can be understood as a file storing CSS style codes. Therefore, by reading the file content of the VUE component, each component file can be obtained according to the file content contained in it. Each component file is shown in the left part of Figure 3, and Figure 3 is a file storage provided by the embodiment of the present application. schematic diagram. The preset asynchronous reading tool can be, for example, fs.readFileSync, which is used to asynchronously read the content of each part of the file contained in the VUE file.

In a possible design, before using the preset asynchronous reading tool to read VUE components, it also includes:

A work instruction is generated according to the component generation requirement, and a command line tool is run in response to the work order, wherein the command line tool is used to enable the applet generation method provided by the embodiment of the present application. It can be understood that the component generation requirements are used to represent the current component conversion requirements, and the existing VUE components need to be converted. Further, an auxiliary tool can be set to convert the VUE components through the auxiliary tool, which is a command-line tool capable of enabling the applet generation method provided by the embodiment of the present application in response to a work order. The specific working prompt corresponding to the command line tool can be set according to the actual situation, which is not limited in this embodiment of the present application.

S102: Correspondingly store the codes in each component file into each temporary file.

Among them, each temporary file includes WeChat Markup Language (WeiXin Markup Language) WXML temporary files, JS temporary files, and WeChat Cascading Style Sheets (WeiXinStyle Sheets) WXSS temporary files.

In order to make the codes of VUE components have a clear correspondence before and after conversion, and to ensure the correctness of the converted applet components, you can store the codes in each component file obtained from the VUE components in corresponding temporary files. Further, the codes in each temporary file are converted respectively. For example, based on the correspondence between the codes in each component file and the codes in each applet component file to be converted to eventually, the code in the page file can be stored in the WXML temporary file, and the code in the JS file can be stored in the The JS temporary file stores the code in the CSS file to the WXSS temporary file. Continuing to refer to FIG. 3 , the right part of FIG. 3 shows the temporary files where the component files are correspondingly stored.

Optionally, when each component file is correspondingly stored in each temporary file, the document format in each temporary file can be set according to the actual situation, for example, it can be a notepad format, a document format, etc., which is not limited in this embodiment of the present application.

S103: Convert the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files, so as to generate a applet according to each applet component file.

Wherein, the preset conversion strategy includes traversing each node of each abstract syntax tree to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed for the code in each temporary file.

When converting the code in each temporary file to obtain each applet component file, a preset conversion strategy is introduced to traverse each node of each abstract syntax tree to modify the node that needs to be modified, that is, the target node Purpose, the codes in each temporary file correspond to form their respective abstract syntax trees. After converting the codes in each temporary file according to the preset conversion strategy, the converted temporary files are correspondingly determined as applet component files, so as to obtain corresponding applet component files. On the basis of obtaining each applet component file, the applet is generated by reading and loading the obtained file content in each applet component file. Wherein, the file content in each applet component file is each applet component obtained after conversion. In addition, it should be noted that when generating the applet, a target file with the suffix of JSON needs to be created. The target file with the suffix of JSON is the configuration JSON file of the applet, and the content of the file is { "component": true }.

In a possible design, in this step S103, the code in each temporary file is converted according to the preset conversion strategy to obtain each applet component file, as shown in FIG. 4 . FIG. 4 is a schematic flowchart of another method for generating a small program provided by an embodiment of the present application. As shown in Figure 4, the embodiment of this application includes:

S201: Convert the code in the WXML temporary file according to a first preset conversion rule to generate a WXML target file.

S202: Convert the code in the JS temporary file according to the second preset conversion rule to generate a JS target file.

S203: Convert the code in the WXSS temporary file according to the third preset conversion rule to generate a WXSS target file.

Wherein, the preset conversion strategy includes a first preset conversion rule, a second preset conversion rule, and a third preset conversion rule, and each applet component file includes a WXML object file, a JS object file, and a WXSS object file. The preset conversion strategy includes a first preset conversion rule, a second preset conversion rule and a third preset conversion rule, wherein the first preset conversion rule is a specific rule for converting the code in the WXML temporary file, and the second The preset conversion rule is a specific rule for converting codes in the JS temporary file, and the third preset conversion rule is a specific rule for converting codes in the WXSS temporary file.

Correspondingly, after the code in the WXML temporary file is converted by the first preset conversion rule, the WXML temporary file is determined as the WXML target file, that is, the code in the WXML target file is the code converted by the first preset conversion rule . After the code in the JS temporary file is converted by the second preset conversion rule, the JS temporary file is determined as the JS target file, that is, the code in the JS target file is the code converted by the second preset conversion rule. After the code in the CSS temporary file is converted by the third preset conversion rule, the CSS temporary file is determined as the CSS target file, that is, the code in the CSS target file is the code converted by the third preset conversion rule.

Wherein, it should be noted that the specific contents of the first preset conversion rule, the second preset conversion rule and the third preset conversion rule are required for converting the codes in each temporary file into corresponding applet components. code, and when using the first preset conversion rule, the second preset conversion rule, and the third preset conversion rule, the abstract syntax tree corresponding to the code in each temporary file is used, so that by traversing each abstract syntax tree and modify the target node of each abstract syntax tree to realize the conversion of the code in each temporary file to the corresponding applet code, improve the conversion efficiency and make the granularity of the modifiable content smaller, thereby ensuring Revised for correctness. The target node of each abstract syntax tree is the node where there is a difference between the VUE component and the applet component.

Further, after obtaining each applet component file, an information file is also generated according to the code in the JS target file, and the information file is used to record the position information of the code of each applet component file in the code of the VUE component, which is convenient for later debugging.

The applet generation method provided by the embodiment of the present application first uses the preset asynchronous reading tool to read the VUE component to obtain each component file in the VUE component, and each component file includes a page file, a JS file and a CSS file. Then, the codes in each component file are correspondingly stored in each temporary file, and each temporary file includes a WXML temporary file, a JS temporary file, and a WXSS temporary file. Finally, convert the code in each temporary file according to the preset conversion strategy to obtain each applet component file, complete the conversion from VUE component to applet component, and then generate the applet according to the file content in each applet component file. Wherein, the preset conversion strategy includes traversing each node of each abstract syntax tree to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed by codes in each temporary file. The applet components are converted based on the preset conversion strategy, which effectively improves the efficiency of obtaining applet components and generating applets, making the granularity of modifiable content smaller, ensuring the correctness of the obtained applet components, and You can know the correspondence between codes before and after modification, which is convenient for subsequent maintenance.

In a possible design, a possible implementation manner of step S201 is shown in FIG. 5 . FIG. 5 is a schematic flowchart of another method for generating a small program provided by the embodiment of the present application. As shown in Figure 5, the embodiment of this application includes:

S2011: Read the WXML temporary file by using a preset asynchronous reading tool to obtain the code in the WXML temporary file.

Use the preset asynchronous reading tool to read the file content of the WXML temporary file, so as to obtain the code in the WXML temporary file, wherein the step is to use the preset asynchronous reading tool to read the file content of the WXML temporary file and read it into The process of converting the content of the file into the corresponding string. Preset asynchronous read tools such as fs.readFileSync.

S2012: Using the page parser to parse the code in the WXML temporary file to obtain a first abstract syntax tree.

Wherein, the first abstract syntax tree includes descriptions of all contents in the page file. Using a page parser such as htmlparser2 to parse the code in the WXML temporary file, that is, parse the string obtained in the above steps, and obtain an abstract syntax tree corresponding to the code in the WXML temporary file, that is, the first abstract syntax tree. Among them, the abstract syntax tree (Abstract Syntax Tree, AST) is a tree representation of the abstract syntax structure of the source code, and each node on the tree is the structured abstract data of the corresponding node in the source code. Therefore, the first abstract syntax tree defines each part in the page file in detail, that is, the first abstract syntax tree includes descriptions of all contents in the page file.

S2013: Modify the first abstract syntax tree according to the first preset conversion rule to obtain the first target abstract syntax tree.

The first abstract syntax tree is modified by using the first preset conversion rule, and the modified first abstract syntax tree is determined as the first target abstract syntax tree to obtain the first target abstract syntax tree.

Wherein, according to the description of the foregoing embodiments, it can be seen that the specific content of the first preset conversion rule is the corresponding rule followed when modifying the code in the WXML temporary file to the code required by the corresponding applet. In the applet, for the content involved in the code in the WXML temporary file, the content in the DOCTYPE tag at the top is not needed, and only the content in the body tag is required. In other words, when modifying the first abstract syntax tree using the first preset conversion rule, you only need to pay attention to the content of the node where the body tag is located in the first abstract syntax tree. For example, the body tag may have only one child element div, The div has two child elements, which are text (TEXT) "VUE TO MP" and a label (ELEMENT) span. The label span has only one child element, which is "This is detail." of type text (TEXT).

The abstract syntax tree obtained by modifying the first abstract syntax tree according to the first preset conversion rule is the first target abstract syntax tree, and step S2014 can be executed to obtain the WXML target file.

S2014: Generate a first object code according to the first object abstract syntax tree, and obtain a WXML object file according to the first object code.

The content represented by the first object abstract syntax tree is determined as the first object code, that is, the first object code is generated according to the first object abstract syntax tree, and the file to which the first object code belongs is determined as a WXML object file, that is, according to The first target code obtains the WXML target file, thereby completing the conversion of the code in the page file in the VUE component to the code in the WXML target file in the applet component file.

In a possible design, a possible implementation of step S2013 includes:

Traverse the first abstract syntax tree, obtain form tags in the first abstract syntax tree, and replace the label content in the form tags according to the preset label mapping table. Among them, the form tag is customized for describing standard HTML tags in the page file that are different from the applet component. Use the preset label mapping table to modify the form label to change it to the label supported by the applet. The preset label mapping table is shown in Table 1 below:

Table 1

The target node of the first abstract syntax tree is modified according to the format modification rule, and then the first abstract syntax tree after the preset expression mapping table is replaced and the format modification rule is modified is determined as the first target abstract syntax tree. Wherein, the first preset conversion rule adopted for modifying the first abstract syntax tree includes the above preset expression mapping table and format modification rules. The format modification rule includes specific modification content involved in modifying the target node of the first abstract syntax tree so that the format of the modified code meets the requirements of the applet component.

In a possible design, format modification rules may include the following content:

For example, modify the column rendering format in the first abstract syntax tree to the applet list rendering format. Specifically, the list rendering format in the VUE component is written as: <tag v-for="(item,index) in list" v -bind:key="index"></tag>, so it needs to be modified to the rendering format of the applet list: <tag wx:for="{{list}}" wx:key="index"></tag >.

For example, modify the conditional rendering format in the first abstract syntax tree to the applet conditional rendering format. Specifically, the conditional rendering format in the VUE component is written as follows:

Therefore, it is necessary to modify the writing method of the conditional rendering format of the applet, as follows:

For example, modify the event binding format in the first abstract syntax tree to the applet event binding format, and the event binding format in the VUE component is written as: <tag @cilck="doSomething"></tag>, modify it to the small program event binding format: <tag bindtap="doSomething"></tag>.

The node to which the content representing list rendering, conditional rendering and event binding belongs in the first abstract syntax tree is the target node of the first abstract syntax tree.

In the applet generating method provided by the embodiment of the present application, the code in the WXML temporary file is converted according to the first preset conversion rule to obtain the WXML object file, and the code in the WXML object file is used to represent the WXML template in the applet component. Among them, the target node of the first abstract syntax tree is modified by traversing the first abstract syntax tree and according to the preset tag mapping table and format modification rules included in the first preset conversion rule, so that the WXML target obtained after modification The code in the file meets the running requirements of the applet, which not only improves the conversion efficiency of the code in the page file in the VUE component to the code in the WXML target file, but also makes the granularity of the modifiable content smaller, ensuring the obtained WXML target The correctness of the code in the file, and the corresponding relationship between the code in the page file and the code in the WXML target file, that is, the code before and after modification, is convenient for subsequent code maintenance and error location.

In a possible design, a possible implementation manner of step S202 is shown in FIG. 6 . FIG. 6 is a schematic flowchart of another applet generation method provided by the embodiment of the present application. As shown in Figure 6, the embodiment of this application includes:

S2021: Use a preset asynchronous reading tool to read the JS temporary file to obtain the code in the JS temporary file.

Use the preset asynchronous reading tool to read the file content of the JS temporary file, so as to obtain the code in the JS temporary file, wherein this step is to use the preset asynchronous reading tool to read the file content of the JS temporary file and read it into The process of converting the content of the file into the corresponding string.

Preset asynchronous read tools such as fs.readFileSync.

S2022: Use the parsing plug-in to parse the code in the JS temporary file to obtain a second abstract syntax tree.

Wherein, the second abstract syntax tree includes a description of all contents in the JS file.

Use the parse method such as @babel/parser to parse the code in the JS temporary file, that is, parse the string obtained in the above steps, and obtain the corresponding abstract syntax tree corresponding to the code in the JS temporary file, that is, the second abstract syntax tree. Among them, the abstract syntax tree (Abstract Syntax Tree, AST) is a tree representation of the abstract syntax structure of the source code, and each node on the tree is the structured abstract data of the corresponding node in the source code. Therefore, the second abstract syntax tree defines each part in the JS file in detail, that is, the second abstract syntax tree includes a description of all contents in the JS file.

S2023: Modify the second abstract syntax tree according to the second preset conversion rule to obtain a second target abstract syntax tree.

The second abstract syntax tree is modified by using the second preset conversion rule, and the modified second abstract syntax tree is determined as the second target abstract syntax tree to obtain the second target abstract syntax tree.

Wherein, according to the description of the foregoing embodiments, it can be seen that the specific content of the second preset conversion rule is the corresponding rule followed when modifying the code in the JS temporary file to the code required by the corresponding applet. The content of the code in the JS file in the VUE component is reflected in the three attributes of data, created, and methods, so the second preset conversion rule can be represented by setting the corresponding attribute modification rules to modify the second abstract syntax tree .

The abstract syntax tree obtained by modifying the second abstract syntax tree according to the second preset conversion rule is the second target abstract syntax tree, and step S2024 can be executed to obtain the JS target file.

S2024: Generate a second object code according to the second object abstract syntax tree, and obtain a JS object file according to the second object code.

The content represented by the second target abstract syntax tree is determined as the second target code, that is, the second target code is generated according to the second target abstract syntax tree, and the file to which the second target code belongs is determined as the JS target file, that is, according to The second target code obtains the JS target file, thereby completing the conversion of the code in the JS file in the VUE component to the code in the JS target file in the applet component.

In a possible design, possible implementations of step 2023 include:

Traverse the second abstract syntax tree, modify the target node of the second abstract syntax tree according to the attribute modification rules, and determine the modified second abstract syntax tree as the second target abstract syntax tree, thereby obtaining the second target abstract syntax tree. The specific content of the second preset conversion rule is the corresponding rule followed when modifying the code in the JS temporary file to the code required by the corresponding applet, and the corresponding rule may specifically include an attribute modification rule.

In one possible design, the attribute modification rules include the following:

For example, the definition of the data attribute in the VUE component is defined by the return data of the return (return) function, but since the object definition is directly used in the applet, for the data attribute, the attribute and value of the return function must first be obtained , and then directly use the attributes and values of the returned function to directly define the data attribute, that is, use the attributes and values of the returned function to replace the returned data of the returned function, modify the definition of the data attribute in the second abstract syntax tree, and the returned data of the returned function is then It is the definition of the data attribute in the corresponding second abstract syntax data in the VUE component before modification, for example, in the form of "key" and "value" as the definition of the data attribute in the applet component.

The attribute modification rules also include modifications to the props attribute definition, for example, modifying the props attribute definition in the second abstract syntax tree and the definition method of the corresponding default attribute value to the target attribute definition and the target definition method, wherein, the target attribute definition and the target The definition method meets the attribute definition requirements of the applet. Specifically, the definition of the props attribute in the VUE component is as follows:

props: {

`` mode: { type: Number, default: 0 }

}.

The property modification rule is to modify the above "props" to "properties", "props" is the definition of the props attribute, "properties" is the definition of the target attribute, "default" represents the definition of the corresponding default attribute value defined by the props attribute, and the property modification rule It is to change "default" to "value", and "value" indicates the target definition method, which meets the attribute definition requirements of the applet. Therefore, the definition of the props attribute in the above VUE component is modified through the attribute modification rules, that is, the definition of the props attribute in the second abstract syntax tree and the definition of the corresponding default attribute value are modified to obtain the property definition requirements of the applet. Target property definitions and target definition are as follows:

properties: {

`` mode: { type: Number, value: 0 }

}.

The property modification rule further includes: modifying the data reading mode of the second abstract syntax tree to a target reading mode, and the target reading mode satisfies the life cycle hook function of the applet. For example, reading data in the VUE component is directly using "this.key", "key" represents the key value of the data, for example, "this.name" can directly get the value corresponding to the data "name" in the VUE component. However, reading data in the applet component adds a level, and the format is "this.data.key", which is equivalent to using "this.data.name" in the VUE component to get the value referred to by "name". When traversing the second abstract syntax tree, when encountering the "ThisExpression" expression, replace the corresponding "property". For example, the expression "this.name" in the VUE component belongs to "MemberExpression" in the second abstract syntax tree , where "this" represents "ThisExpression", and "name" represents a "property" of type "Identifier". In the applet component, "this.data.name" belongs to "MemberExpression" in the modified second abstract syntax tree, "this.data" belongs to the child "MemberExpression", and "name" is the same as the child "MemberExpression". A level of "property" whose type is "Identifier" modifies the data reading method of the second abstract syntax tree to meet the target reading method of the life cycle hook function of the applet.

The property modifying rule also includes a method of modifying the assignment expression in the second abstract syntax tree into the execution function of the applet. Assignment can be made directly in the VUE component. For example, when you need to assign a value to "name", follow the expression "this.name = 'value'". But in the applet, the following expressions must be used to assign values correctly:

this.setData({

name: 'value'

}).

The assignment expression in the above applet is the way the applet executes the function. Among them, "setData" is built in the applet. When modifying the assignment expression, it is necessary to modify the assigned expression in the second abstract syntax tree to the way the applet executes the function. "this.name = 'value'" The whole expression is defined as "ExpressionStatement" in the second abstract syntax tree, and the subdivision is defined as the expression "expression" in the negative value expression "AssignmentExpression", and the operation symbol "operator" means " =", "this.name" as the left part of the entire assignment expression, and "'value'" as the right part.

The node to which the part involved in the attribute modification rule belongs in the second abstract syntax tree is the target node of the second abstract syntax tree.

In the applet generation method provided by the embodiment of the present application, the code in the JS temporary file is converted according to the second preset conversion rule to obtain the JS target file, and the code in the JS target file is used to represent the JS logic code in the applet component fragment. Wherein, the target node of the second abstract syntax tree is modified by traversing the second abstract syntax tree and according to the attribute modification rules included in the second preset conversion rules, so that the code in the modified JS target file conforms to the small This not only improves the conversion efficiency of the code in the JS file in the VUE component to the code in the JS target file, but also makes the granularity of the modifiable content smaller, ensuring the correctness of the code in the obtained JS target file , and ensure the corresponding relationship between the code in the JS file and the code in the JS target file, that is, the code before and after modification, so as to facilitate subsequent code maintenance and error location.

In a possible design, a possible implementation manner of step S203 is shown in FIG. 7 . FIG. 7 is a schematic flowchart of another method for generating a small program provided by the embodiment of the present application. As shown in Figure 7, the embodiment of this application includes:

S2031: Read the WXSS temporary file by using a preset asynchronous reading tool to obtain the code in the WXSS temporary file.

Use the preset asynchronous reading tool to read the file content of the WXSS temporary file, so as to obtain the code in the WXSS temporary file, wherein this step is to use the preset asynchronous reading tool to read the file content of the WXSS temporary file and read it into The process of converting the content of the file into the corresponding string.

Preset asynchronous read tools such as fs.readFileSync.

S2032: Use the syntax analyzer to parse the code in the WXSS temporary file to obtain a third abstract syntax tree.

Wherein, the third abstract syntax tree includes a description of all content in the CSS file.

Use a parser such as Cascading Style Sheet-Tree (CSSTREE) to parse the code in the WXSS temporary file, that is, parse the string obtained in the above steps, and obtain the corresponding abstract syntax tree corresponding to the code in the WXSS temporary file, that is, the third abstract syntax tree . Among them, the abstract syntax tree (Abstract Syntax Tree, AST) is a tree representation of the abstract syntax structure of the source code, and each node on the tree is the structured abstract data of the corresponding node in the source code. Therefore, the third abstract syntax tree defines each part in the CSS file in detail, that is, the third abstract syntax tree includes a description of all contents in the CSS file.

S2033: Modify the third abstract syntax tree according to the third preset conversion rule to obtain a third target abstract syntax tree.

The third abstract syntax tree is modified by using the third preset conversion rule, and the modified third abstract syntax tree is determined as the third target abstract syntax tree to obtain the third target abstract syntax tree.

Wherein, according to the description of the foregoing embodiments, it can be seen that the specific content of the third preset conversion rule is the corresponding rule followed when modifying the code in the WXSS temporary file to the code required by the corresponding applet.

The abstract syntax tree obtained by modifying the third abstract syntax tree according to the third preset conversion rule is the third target abstract syntax tree, and step S2034 can be executed to obtain the WXSS target file.

S2034: Generate a third object code according to the third object abstract syntax tree, and obtain a WXSS object file according to the third object code.

The content represented by the third target abstract syntax tree is determined as the third target code, that is, the third target code is generated according to the third target abstract syntax tree, and the file to which the third target code belongs is determined as a WXSS target file, that is, according to The third target code obtains the WXSS target file, thereby completing the conversion of the code in the CSS file in the VUE component to the code in the WXSS target file in the applet component file.

In a possible design, possible implementations of step S2033 include:

Traverse the third abstract syntax tree, modify the target node of the third abstract syntax tree according to the selector modification rule, and determine the modified third abstract syntax tree as the third target abstract syntax tree, thereby obtaining the third target abstract syntax tree. The specific content of the third preset conversion rule is the corresponding rule followed when modifying the code in the WXSS temporary file to the code required by the corresponding applet, and the corresponding rule may specifically include a selector modification rule.

In one possible design, selector modification rules include the following:

For example, the unit of measurement declared by the target selector in the third abstract syntax tree is modified to the target unit of measurement, and the target unit of measurement satisfies the adaptive size unit of each applet. For example, in the VUE component, there is a rule statement. Through this rule statement, it is known that the value corresponding to the CSS selector of type "ClassSelector" is "params-list-row", and "block" corresponds to the value of the CSS selector. Value, for example, the value is to declare the value of the bottom margin "padding-bottom" is 10, and the unit of measurement of this value is "px". Since the applet uses "rpx" as the unit of measurement, that is, "rpx" is the target unit of measurement, which satisfies the adaptive size unit of the applet, so the third abstract syntax tree is traversed, and the target selector in the third abstract syntax tree such as The type is "Dimension" and the declared measurement unit "px" is all modified to the target measurement unit "rpx" according to 1:1. Wherein, the node in the third abstract syntax tree whose type is "Dimension" and whose declared measurement unit is "px" belongs to is the target node of the third abstract syntax tree.

In addition, selector modification rules also include logging limited selectors. For applets, the selectors supported by them are limited. If you traverse the third abstract syntax tree and find that there are selectors that are not supported by applets, you need to use logs to record the selectors that these applets do not support. These applets do not support The supported selectors are limited selectors. In other words, the limited selectors can be any selectors not supported by the applet in the third abstract syntax tree.

The selectors currently supported by the applet include Class Selector, ID Selector, Type Selector, Pseudo-element Selector Element Selector).

Among them, the log record is to remind the developer that a style rule that is not currently supported is used in the applet, but it can be compiled normally, but there is no corresponding effect in the applet. For example, "input[type=textarea]" is an attribute selector (AttributeSelector), which has no effect in the applet, but it is still compiled normally, and the developer is prompted by logging when generating the WXSS target file.

In the applet generation method provided by the embodiment of the present application, the code in the WXSS temporary file is converted according to the third preset conversion rule to obtain the WXSS target file, and the code in the WXSS target file is used to represent the WXSS component style in the applet component . Wherein, the target node of the third abstract syntax tree is modified by traversing the third abstract syntax tree and according to the selector modification rules included in the third preset transformation rules, so that the codes in the modified WXSS target file conform to Mini-program operation requirements, which not only improves the conversion efficiency of the code in the CSS file in the VUE component to the code in the WXSS target file, but also makes the granularity of the modifiable content smaller, ensuring the correctness of the code in the obtained WXSS target file , and ensure the corresponding relationship between the code in the CSS file and the code in the WXSS target file, that is, the code before and after modification, which is convenient for subsequent code maintenance and error location.

FIG. 8 is a schematic structural diagram of an apparatus for generating a small program provided by an embodiment of the present application. As shown in FIG. 8 , the applet generation device 300 provided in the embodiment of the present application includes:

The obtaining module 301 is used to read the VUE component by using a preset asynchronous reading tool to obtain each component file in the VUE component, and each component file includes a page file, a JS file and a cascading style sheet CSS file.

The storage module 302 is used to store the codes in each component file correspondingly to each temporary file, and each temporary file includes a WeChat markup language WXML temporary file, a JS temporary file and a WeChat Cascading Style Sheet WXSS temporary file.

The processing module 303 is configured to convert the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files, so as to generate applets according to each applet component file. The preset conversion strategy includes traversing each node of each abstract syntax tree to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed for the code in each temporary file.

In a possible design, FIG. 9 is a schematic structural diagram of a processing module provided in an embodiment of the present application. As shown in FIG. 9, the processing module 303 in the applet generating device 300 provided by the embodiment of the present application includes:

The first processing sub-module 3031 is configured to convert the code in the WXML temporary file according to the first preset conversion rule to generate a WXML target file;

The second processing sub-module 3032 is used to convert the code in the JS temporary file according to the second preset conversion rule to generate the JS target file;

The third processing sub-module 3033 is configured to convert the code in the WXSS temporary file according to the third preset conversion rule to generate a WXSS target file.

Wherein, the preset conversion strategy includes a first preset conversion rule, a second preset conversion rule, and a third preset conversion rule, and each applet component file includes a WXML object file, a JS object file, and a WXSS object file.

In a possible design, the first processing submodule 3031 is specifically used for:

Use the preset asynchronous reading tool to read the WXML temporary file to obtain the code in the WXSS temporary file;

Utilize the page parser to parse the code in the WXML temporary file to obtain a first abstract syntax tree, and the first abstract syntax tree includes a description of all contents in the page file;

Modifying the first abstract syntax tree according to the first preset conversion rule to obtain the first target abstract syntax tree;

The first object code is generated according to the first object abstract syntax tree, and the WXML object file is obtained according to the first object code.

In a possible design, the first processing submodule 3031 is also specifically used for:

Traversing the first abstract syntax tree, obtaining the form label, and replacing the label content in the form label according to the preset label mapping table;

modifying the target node of the first abstract syntax tree according to the format modification rule;

Determining the first abstract syntax tree modified by the preset label mapping table and the format modification rule as the first target abstract syntax tree;

Wherein, the first preset conversion rule includes a preset tag mapping table and a format modification rule.

In one possible design, format modification rules include:

Modify the column rendering format in the first abstract syntax tree to the applet list rendering format;

Modify the conditional rendering format in the first abstract syntax tree to the applet conditional rendering format;

Modify the event binding format in the first abstract syntax tree to the applet event binding format.

In a possible design, the second processing submodule 3032 is specifically used for:

Use the preset asynchronous reading tool to read the JS temporary file to obtain the code in the JS temporary file;

Parse the code in the JS temporary file by using the parsing plug-in to obtain a second abstract syntax tree, and the second abstract syntax tree includes a description of all contents in the JS file;

Modifying the second abstract syntax tree according to the second preset conversion rule to obtain the second target abstract syntax tree;

A second object code is generated according to the second object abstract syntax tree, and a JS object file is obtained according to the second object code.

In a possible design, the second processing submodule 3032 is also specifically used for:

The second abstract syntax tree is traversed, and the target node of the second abstract syntax tree is modified according to the attribute modification rules to obtain the second target abstract syntax tree. The second preset conversion rules include attribute modification rules.

In one possible design, attribute modification rules include:

Obtain the attributes and values of the returned function, and use the attributes and values of the returned function to replace the returned data of the returned function to modify the definition of the data attribute in the second abstract syntax tree. The returned data of the returned function is the data in the second abstract syntax tree before modification property definition;

modifying the props attribute definition in the second abstract syntax tree and the definition method of the corresponding default attribute value to the target attribute definition and the target definition method respectively, and the target attribute definition and the target definition method meet the property definition requirements of the applet;

Modify the data reading method of the second abstract syntax tree to the target reading method, and the target reading method satisfies the life cycle hook function of the applet;

The assignment expression in the second abstract syntax tree is modified to the way of executing the function of the applet.

In a possible design, the third processing submodule 3033 is specifically used for:

Use the preset asynchronous reading tool to read the WXSS temporary file to obtain the code in the WXSS temporary file;

Parse the code in the WXSS temporary file with a syntax analyzer to obtain a third abstract syntax tree, where the third abstract syntax tree includes a description of all content in the CSS tag;

Traversing and modifying the third abstract syntax tree according to the third preset conversion rule to obtain the third target abstract syntax tree;

A third object code is generated according to the third object abstract syntax tree, and a WXSS object file is obtained according to the third object code.

In a possible design, the third processing submodule 3033 is also specifically used for:

The third abstract syntax tree is traversed, and the third abstract syntax tree is modified according to the selector modification rule to obtain a third target abstract syntax tree. The third preset conversion rule includes the selector modification rule.

In one possible design, selectors modify rules, including:

Modify the unit of measurement declared by the target selector in the third abstract syntax tree to the target unit of measurement, and the target unit of measurement satisfies the adaptive size unit of the applet;

A log record limited selector is used, and the limited selector is any selector not supported by the applet in the third abstract syntax tree.

In a possible design, the applet generating apparatus 300 further includes: a fourth processing submodule. The fourth processing submodule is used for:

In a possible design, the applet generating apparatus 300 further includes: a fifth processing submodule. The fifth processing submodule is used for:

A work order is generated based on the component generation requirements, a command line tool is run in response to the work order, the command line tool is used to enable the applet generation method.

It is worth noting that the above-mentioned Figures 8 and 9 and the applet generation device provided by the optional embodiment can be used to execute the steps of the applet generation method provided by any of the above-mentioned embodiments. The specific implementation method and technical effect are similar. Here No longer.

The above-mentioned device embodiments provided in the present application are only illustrative, and the module division therein is only a logical function division, and there may be other division methods in actual implementation. For example several modules may be combined or may be integrated into another system. The mutual coupling of various modules can be realized through some interfaces, and these interfaces are usually electrical communication interfaces, but it is not excluded that they may be mechanical interfaces or other forms of interfaces. Thus, modules described as separate components may or may not be physically separate, and may be located at one location or distributed to different locations on the same or different devices.

FIG. 10 is a schematic structural diagram of an electronic device provided by the present application. As shown in FIG. 10 , the electronic device 400 may include: at least one processor 401 and a memory 402 . FIG. 10 shows an electronic device using a processor as an example.

The memory 402 is used for storing computer programs of the processor 401 . Specifically, the program may include program code, and the program code includes computer operation instructions. The memory 402 may include a high-speed RAM memory, and may also include a non-volatile memory (non-volatile memory), such as at least one disk storage.

The processor 401 is configured to execute the computer program stored in the memory 402, so as to realize each step of the applet generating method in each method embodiment above.

Wherein, processor 401 may be a central processing unit (central processing unit, referred to as CPU), or a specific integrated circuit (application specific integrated circuit, referred to as ASIC), or one or more integrated circuits configured to implement the embodiments of the present application.

Optionally, the memory 402 can be independent or integrated with the processor 401 . When the memory 402 is a device independent of the processor 401, the electronic device 400 may further include:

The bus 403 is used to connect the processor 401 and the memory 402 . The bus can be an industry standard architecture (industry standard architecture (ISA) bus, peripheral component interconnect (PCI) bus or extended industry standard architecture (EISA) bus, etc. The bus can be divided into address bus, data bus, control bus, etc., but it does not mean that there is only one bus or one type of bus.

Optionally, in terms of specific implementation, if the memory 402 and the processor 401 are integrated and implemented on one chip, the memory 402 and the processor 401 may communicate through an internal interface.

The present application also provides a computer-readable storage medium, which may include: U disk, mobile hard disk, read-only memory (read-only memory, ROM), random access memory (random access memory, RAM) ), a magnetic disk or an optical disk, and other media that can store program codes. Specifically, the computer-readable storage medium stores a computer program. When at least one processor of the electronic device executes the computer program, the electronic device executes the above-mentioned Each step of the applet generating method provided in the above implementation manner.

An embodiment of the present application further provides a computer program product, where the computer program product includes a computer program, and the computer program is stored in a readable storage medium. At least one processor of the electronic device can read the computer program from the readable storage medium, and the at least one processor executes the computer program so that the electronic device implements each step of the applet generating method provided in the above-mentioned various embodiments.

Other embodiments of the present application will be readily apparent to those skilled in the art from consideration of the specification and practice of the invention disclosed herein. This application is intended to cover any modification, use or adaptation of the application, these modifications, uses or adaptations follow the general principles of the application and include common knowledge or conventional technical means in the technical field not disclosed in the application . The specification and examples are to be considered exemplary only, with a true scope and spirit of the application indicated by the appended claims. It should be understood that the present application is not limited to the precise constructions which have been described above and shown in the accompanying drawings, and various modifications and changes may be made without departing from the scope thereof. The scope of the application is limited only by the appended claims.

Claims

A small program generation method, characterized by comprising:

Utilize preset asynchronous reading tool to read VUE component, obtain each component file in described VUE component, described each component file comprises page file, JS file and cascading style sheet CSS file;

The codes in each of the component files are correspondingly stored in each temporary file respectively, and each of the temporary files includes a Wechat markup language WXML temporary file, a JS temporary file and a Wechat Cascading Style Sheet WXSS temporary file;

Convert the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files to generate applets according to the applet component files. The preset conversion strategy includes traversing each abstract syntax tree Each node of each node is modified to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed for the code in each temporary file.
The applet generation method according to claim 1, characterized in that, converting the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files, including:

converting the code in the WXML temporary file according to a first preset conversion rule to generate a WXML target file;

converting the code in the JS temporary file according to the second preset conversion rule to generate the JS target file;

converting the code in the WXSS temporary file according to a third preset conversion rule to generate a WXSS target file;

Wherein, the preset conversion policy includes the first preset conversion rule, the second preset conversion rule, and the third preset conversion rule, and the applet component files include the WXML target file, The JS target file and the WXSS target file.
The applet generating method according to claim 2, wherein said converting the code in said WXML temporary file according to a first preset conversion rule to generate a WXML target file includes:

Using the preset asynchronous reading tool to read the WXML temporary file to obtain the code in the WXSS temporary file;

Using a page parser to parse the code in the WXML temporary file to obtain a first abstract syntax tree, the first abstract syntax tree including a description of all content in the page file;

Modifying the first abstract syntax tree according to the first preset conversion rule to obtain a first target abstract syntax tree;

Generate a first object code according to the first object abstract syntax tree, and obtain the WXML object file according to the first object code.
The applet generating method according to claim 3, wherein said modifying said first abstract syntax tree according to said first preset conversion rule to obtain a first target abstract syntax tree comprises:

Traversing the first abstract syntax tree to obtain a form tag, and replacing the tag content in the form tag according to a preset tag mapping table;

modifying the target node of the first abstract syntax tree according to a format modification rule;

determining the first abstract syntax tree that has been replaced by the preset label mapping table and modified by the format modification rule as the first target abstract syntax tree;

Wherein, the first preset conversion rule includes the preset tag mapping table and the format modification rule.
The applet generation method according to claim 4, wherein the format modification rules include:

modifying the column rendering format in the first abstract syntax tree to the applet list rendering format;

modifying the conditional rendering format in the first abstract syntax tree to the applet conditional rendering format;

The event binding format in the first abstract syntax tree is modified to the applet event binding format.
The method for generating a small program according to any one of claims 2-5, wherein the converting the code in the JS temporary file according to the second preset conversion rule to generate the JS target file includes:

Using the preset asynchronous reading tool to read the JS temporary file to obtain the code in the JS temporary file;

Parsing the code in the JS temporary file by using the parsing plug-in to obtain a second abstract syntax tree, the second abstract syntax tree including a description of all content in the JS file;

Modifying the second abstract syntax tree according to the second preset conversion rule to obtain a second target abstract syntax tree;

Generate a second object code according to the second object abstract syntax tree, and obtain the JS object file according to the second object code.
The applet generating method according to claim 6, wherein said modifying said second abstract syntax tree according to said second preset conversion rule to obtain a second target abstract syntax tree comprises:

Traversing the second abstract syntax tree, modifying target nodes of the second abstract syntax tree according to attribute modification rules to obtain the second target abstract syntax tree, wherein the second preset conversion rules include the attribute modification rules.
The applet generating method according to claim 7, wherein the property modification rules include:

Obtain the attributes and values of the return function, and use the attributes and values of the return function to replace the return data of the return function to modify the definition of the data attribute in the second abstract syntax tree, and the return data of the return function is modified The definition of the data attribute in the aforementioned second abstract syntax tree;

modifying the definition of the props attribute in the second abstract syntax tree and the definition of the corresponding default attribute value to the definition of the target attribute and the definition of the target, the definition of the target attribute and the definition of the target meet the attributes of the applet define requirements;

modifying the data reading mode of the second abstract syntax tree to a target reading mode, and the target reading mode satisfies the life cycle hook function of the applet;

Modifying the assignment expression in the second abstract syntax tree to the mode of executing the function of the applet.
The method for generating a small program according to any one of claims 2-8, wherein said converting the code in said WXSS temporary file according to a third preset conversion rule to generate a WXSS target file includes:

Using the preset asynchronous reading tool to read the WXSS temporary file to obtain the code in the WXSS temporary file;

Using a syntax analyzer to parse the code in the WXSS temporary file to obtain a third abstract syntax tree, the third abstract syntax tree includes a description of all content in the CSS tag;

Traversing and modifying the third abstract syntax tree according to the third preset conversion rule to obtain a third target abstract syntax tree;

Generate a third object code according to the third object abstract syntax tree, and obtain the WXSS object file according to the third object code.
The applet generating method according to claim 9, wherein the step of traversing and modifying the third abstract syntax tree according to the third preset conversion rule to obtain a third target abstract syntax tree includes:

The third abstract syntax tree is traversed, and the third abstract syntax tree is modified according to the selector modification rule to obtain the third target abstract syntax tree, and the third preset conversion rule includes the selector modification rule.
The applet generation method according to claim 10, wherein the selector modification rule includes:

modifying the unit of measure declared by the target selector in the third abstract syntax tree to a target unit of measure, the target unit of measure meeting the self-adaptive size unit of the applet;

Logging is used to record limited selectors, the limited selectors being any selectors not supported by the applet in the third abstract syntax tree.
The applet generating method according to any one of claims 2-11, characterized in that, after obtaining each applet component file, further comprising:

The information file is generated according to the code in the JS target file, and the information file is used to record the position information of the code of each applet component file in the code of the VUE component.
The applet generating method according to any one of claims 1-12, characterized in that, before reading the VUE component with a preset asynchronous reading tool, it further includes:

A work order is generated according to the component generation requirement, and a command line tool is executed in response to the work order, and the command line tool is used to enable the applet generation method.
A small program generating device is characterized in that it includes:

The acquisition module is used to read the VUE component using a preset asynchronous reading tool to obtain each component file in the VUE component, and each component file includes a page file, a JS file and a cascading style sheet CSS file;

The storage module is used to store the codes in each of the component files correspondingly to each temporary file respectively, and each of the temporary files includes a Wechat markup language WXML temporary file, a JS temporary file and a Wechat Cascading Style Sheet WXSS temporary file;

A processing module, configured to convert the code in each temporary file according to a preset conversion strategy to obtain corresponding applet component files, so as to generate applets according to the applet component files, and the preset conversion strategy includes traversing Each node of each abstract syntax tree is used to modify the target node of each abstract syntax tree, and each abstract syntax tree is correspondingly formed for the code in each temporary file.
An electronic device, characterized in that it comprises:

Processor; and,

a memory for storing the computer program of the processor;

Wherein, the processor is configured to implement the applet generating method according to any one of claims 1 to 13 by executing the computer program.
A computer-readable storage medium, on which a computer program is stored, wherein, when the computer program is executed by a processor, the method for generating a small program according to any one of claims 1 to 13 is realized.
A computer program product, comprising a computer program, characterized in that, when the computer program is executed by a processor, the applet generation method described in any one of claims 1 to 13 is realized.