CN111124481A - Installation package generation method and device of webpage application program, storage medium and equipment - Google Patents
Installation package generation method and device of webpage application program, storage medium and equipment Download PDFInfo
- Publication number
- CN111124481A CN111124481A CN201911351021.7A CN201911351021A CN111124481A CN 111124481 A CN111124481 A CN 111124481A CN 201911351021 A CN201911351021 A CN 201911351021A CN 111124481 A CN111124481 A CN 111124481A
- Authority
- CN
- China
- Prior art keywords
- target
- code file
- source code
- node
- application program
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 65
- 238000009434 installation Methods 0.000 title claims abstract description 50
- 230000008569 process Effects 0.000 claims abstract description 20
- 238000011161 development Methods 0.000 claims abstract description 13
- 239000012634 fragment Substances 0.000 claims description 50
- 238000004590 computer program Methods 0.000 claims description 10
- 238000004806 packaging method and process Methods 0.000 claims description 7
- 230000004048 modification Effects 0.000 claims description 5
- 238000012986 modification Methods 0.000 claims description 5
- 238000003491 array Methods 0.000 claims description 4
- 230000007306 turnover Effects 0.000 claims description 2
- 238000012423 maintenance Methods 0.000 abstract description 6
- 239000002609 medium Substances 0.000 description 11
- 238000010586 diagram Methods 0.000 description 8
- 230000009286 beneficial effect Effects 0.000 description 3
- 230000008901 benefit Effects 0.000 description 3
- PCTMTFRHKVHKIS-BMFZQQSSSA-N (1s,3r,4e,6e,8e,10e,12e,14e,16e,18s,19r,20r,21s,25r,27r,30r,31r,33s,35r,37s,38r)-3-[(2r,3s,4s,5s,6r)-4-amino-3,5-dihydroxy-6-methyloxan-2-yl]oxy-19,25,27,30,31,33,35,37-octahydroxy-18,20,21-trimethyl-23-oxo-22,39-dioxabicyclo[33.3.1]nonatriaconta-4,6,8,10 Chemical compound C1C=C2C[C@@H](OS(O)(=O)=O)CC[C@]2(C)[C@@H]2[C@@H]1[C@@H]1CC[C@H]([C@H](C)CCCC(C)C)[C@@]1(C)CC2.O[C@H]1[C@@H](N)[C@H](O)[C@@H](C)O[C@H]1O[C@H]1/C=C/C=C/C=C/C=C/C=C/C=C/C=C/[C@H](C)[C@@H](O)[C@@H](C)[C@H](C)OC(=O)C[C@H](O)C[C@H](O)CC[C@@H](O)[C@H](O)C[C@H](O)C[C@](O)(C[C@H](O)[C@H]2C(O)=O)O[C@H]2C1 PCTMTFRHKVHKIS-BMFZQQSSSA-N 0.000 description 2
- 230000006870 function Effects 0.000 description 2
- 230000008859 change Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 239000012120 mounting media Substances 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 238000012545 processing Methods 0.000 description 1
- 230000008707 rearrangement Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/70—Software maintenance or management
- G06F8/71—Version control; Configuration management
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/60—Software deployment
- G06F8/61—Installation
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Computer Security & Cryptography (AREA)
- Information Transfer Between Computers (AREA)
Abstract
The embodiment of the invention discloses a method, a device, a storage medium and equipment for generating an installation package of a webpage application program, wherein the method comprises the following steps: acquiring a source code file corresponding to a target page in a webpage application program, wherein the source code file is configured with a preset reverse style triggering condition; modifying the source code file to obtain a corresponding target code file so as to add reverse style attributes to the target page and the target elements in the target page; and generating an installation package corresponding to the webpage application program based on the target code file, so that in the running process of the webpage application program, under the condition that a preset reverse style triggering condition is met, the target page is reversely displayed based on the reverse style attribute. The technical scheme of the embodiment of the invention can save the development and maintenance cost of personnel on the basis of considering both the forward display mode and the reverse display mode.
Description
Technical Field
The embodiment of the invention relates to the technical field of webpage application program development, in particular to a method, a device, a storage medium and equipment for generating an installation package of a webpage application program.
Background
With the continuous development of the internet and Web front-end technology, the functions and codes of Web page (Web) applications are considered more and more, and the consideration of the operation needs in different regions is called Web internationalization. For reading habits of different language systems, there are two writing manners of characters from left to right (such as english) and from right to left (such as arabic), and a corresponding left-to-right or right-to-left display manner needs to be provided when a corresponding language is displayed on a Web application.
In Web internationalization, an implementation scheme of a Web application program for the two display modes is generally to develop two different sets of pages, which respectively meet reading habits of corresponding people, but the scheme needs double development and maintenance costs, so that the existing development scheme of the Web application program needs to be improved.
Disclosure of Invention
The embodiment of the invention provides a method, a device, a storage medium and equipment for generating an installation package of a webpage application program, which can optimize an installation package generation scheme of the webpage application program.
In a first aspect, an embodiment of the present invention provides a method for generating an installation package of a web application, including:
acquiring a source code file corresponding to a target page in a webpage application program, wherein the source code file is configured with a preset reverse style triggering condition;
modifying the source code file to obtain a corresponding target code file so as to add reverse style attributes to the target page and the target elements in the target page;
and generating an installation package corresponding to the webpage application program based on the target code file, so that the target page is reversely displayed based on the reverse style attribute under the condition that the preset reverse style triggering condition is met in the running process of the webpage application program.
In a second aspect, an embodiment of the present invention provides an installation package generating apparatus for a web application, including:
the code file acquisition module is used for acquiring a source code file corresponding to a target page in a webpage application program, and the source code file is configured with a preset reverse style trigger condition;
the code file modification module is used for modifying the source code file to obtain a corresponding target code file so as to add reverse style attributes to the target page and the target elements in the target page;
and the installation package generation module is used for generating an installation package corresponding to the webpage application program based on the target code file so as to reversely display the target page based on the reverse style attribute under the condition that the preset reverse style triggering condition is met in the running process of the webpage application program.
In a third aspect, the present invention provides a computer-readable storage medium, on which a computer program is stored, where the computer program is executed by a processor to implement the method provided by the present invention.
In a fourth aspect, an embodiment of the present invention provides a computer device, which includes a memory, a processor, and a computer program stored in the memory and executable on the processor, and when the processor executes the computer program, the method according to an embodiment of the present invention is implemented.
According to the installation package generation scheme of the webpage application program provided by the embodiment of the invention, the source code file corresponding to the target page in the webpage application program is obtained, the source code file is modified to obtain the corresponding target code file, so that the reverse style attribute is added to the target page and the target element in the target page, and the installation package corresponding to the webpage application program is generated based on the target code file, so that the target page is reversely displayed based on the reverse style attribute under the condition that the preset reverse style triggering condition is met in the running process of the webpage application program. According to the technical scheme, reverse style attributes are added to the target page and the target elements in the target page by modifying the source code file in the webpage application program, when the webpage application program runs, if preset reverse style triggering conditions are met, the page is reversely displayed, meanwhile, the target elements can keep the original display direction and match the reading habit of a user due to the fact that the target elements have double reverse style attributes, and therefore on the basis of considering both the forward display mode and the reverse display mode, development and maintenance cost of personnel can be saved.
Drawings
Fig. 1 is a flowchart of an installation package generating method of a web application according to an embodiment of the present invention;
fig. 2 is a flowchart of another method for generating an installation package of a web application according to an embodiment of the present invention;
FIG. 3 is a schematic diagram of forward display of a web page according to an embodiment of the present invention;
FIG. 4 is a schematic diagram illustrating a reverse display of a web page according to an embodiment of the present invention;
fig. 5 is a schematic structural diagram of an installation package generating apparatus for a web application according to an embodiment of the present invention;
fig. 6 is a block diagram of a computer device according to an embodiment of the present invention.
Detailed Description
The present invention will be described in further detail with reference to the accompanying drawings and examples. It is to be understood that the specific embodiments described herein are merely illustrative of the invention and are not limiting of the invention. It should be further noted that, for the convenience of description, only some of the structures related to the present invention are shown in the drawings, not all of the structures.
Before discussing exemplary embodiments in more detail, it should be noted that some exemplary embodiments are described as processes or methods depicted as flowcharts. Although a flowchart may describe the steps as a sequential process, many of the steps can be performed in parallel, concurrently or simultaneously. In addition, the order of the steps may be rearranged. The process may be terminated when its operations are completed, but may have additional steps not included in the figure. The processes may correspond to methods, functions, procedures, subroutines, and the like.
Fig. 1 is a flowchart of an installation package generating method for a web application according to an embodiment of the present invention, where the present embodiment is applicable to a case of generating an installation package for a web application, and the method may be executed by an installation package generating apparatus for a web application, where the apparatus may be implemented by software and/or hardware, and may generally be integrated in a computer device. As shown in fig. 1, the method may specifically include:
s101, obtaining a source code file corresponding to a target page in the webpage application program.
The Web application is a Web application, and is an application accessible through the Web, and the greatest benefit is that a user can easily access the application only by using a browser without installing other software. The web application in this embodiment may be installed in a computer or a mobile terminal, and is not limited in particular. The target pages are web pages included in the web application, and the number and type of the target pages are not limited in this embodiment. The source code in the embodiment of the present invention may be a program code written in a programming language, which organizes and typesets elements on a webpage according to a default display direction, where the elements on the webpage may include pictures, videos, audios, and texts, and the source code file is a file storing the program code. Wherein, the default display direction is the display direction conforming to the reading habit from left to right, and the reverse display direction is the display direction conforming to the reading habit from right to left
In this embodiment, a source code file corresponding to a target page in a packaging stage or a publishing stage of a web application may be acquired, and a specific acquisition manner is not limited, for example, a file loader (loader) in a code compiling tool Webpack is used for acquisition, and the acquisition manner may be set in a development stage of the web application. In the packaging stage of the web application, the page may be developed according to the design, and the source code files of the page may be extracted according to a set order, which is not limited in this embodiment, for example, the set order may be an order in which the source code files depend. Or, in the publishing stage of the web application, traversing the publishing directory and extracting the source code file.
S102, modifying the source code file to obtain a corresponding target code file so as to add reverse style attributes to the target page and the target elements in the target page.
The target element is a special element among elements included in the target page, and is generally an element that does not need to change the display direction due to different reading habits. For example, the target elements may include picture elements and/or text elements. Optionally, the target element may also be set during the development phase of the web application.
Illustratively, the reverse style attribute is attribute information for enabling the item carrying the attribute to be reversely displayed. According to the embodiment of the invention, the reverse style attribute is added to the target page and the target element in the target page by modifying the source code file, and the target element is contained in the target page, namely, the target element has double reverse style attributes.
S103, generating an installation package corresponding to the webpage application program based on the target code file, so that in the running process of the webpage application program, under the condition that a preset reverse style triggering condition is met, the target page is reversely displayed based on the reverse style attribute.
The preset reverse style triggering condition may be configured in the source code file, and the preset reverse style triggering condition includes a language type, that is, in the embodiment of the present invention, whether the preset reverse style triggering condition is satisfied may be determined according to a difference of the language type. Illustratively, the default display orientation corresponds to English, and the language corresponding to the reverse display orientation may include Arabic, and the like. If the current language type corresponds to a language type that needs to be reversely displayed (may be referred to as a reverse display type), it may be determined that the preset reverse style trigger condition is satisfied.
In this embodiment, after the object code file is obtained, a packaging or publishing process may be completed based on the object code file, so as to obtain an installation package corresponding to the web application. The installation package can be installed in the equipment to realize loading of the webpage application program, and after the installation is finished, in the running process of the webpage application program, if the language type of the current webpage application program is determined to belong to the reverse display type according to the current geographic position, the language environment of the equipment where the current webpage application program is located, or the language code of the current webpage application program, the preset reverse style triggering condition is met, and the target page is reversely displayed based on the reverse style attribute. The reverse display type includes specific language types and numbers, but is not limited in this embodiment, and for example, the reverse display type may include arabic, urdit, hebrew, and the like.
According to the installation package generation scheme of the webpage application program provided by the embodiment of the invention, the source code file corresponding to the target page in the webpage application program is obtained, the source code file is modified to obtain the corresponding target code file, so that the reverse style attribute is added to the target page and the target element in the target page, and the installation package corresponding to the webpage application program is generated based on the target code file, so that the target page is reversely displayed based on the reverse style attribute under the condition that the preset reverse style triggering condition is met in the running process of the webpage application program. According to the technical scheme, reverse style attributes are added to the target page and the target elements in the target page by modifying the source code file in the webpage application program, when the webpage application program runs, if preset reverse style triggering conditions are met, the page is reversely displayed, meanwhile, the target elements can keep the original display direction and match the reading habit of a user due to the fact that the target elements have double reverse style attributes, and therefore on the basis of considering both the forward display mode and the reverse display mode, development and maintenance cost of personnel can be saved.
In some embodiments, modifying the source code file to obtain a corresponding object code file may include: extracting a markup language fragment in a source code file; identifying a target node contained in the markup language fragment, and adding a turnover class in a class list of the target node, wherein the target node corresponds to a target element; and adding reverse style attributes to the root node and the target node of the target page to obtain a target code file. The Markup Language fragment may be an eXtensible Markup Language (XML) fragment or a hypertext Markup Language (HTML) fragment. In this embodiment, the manner of extracting the markup language fragments from the source code file is not limited, and may be set according to actual situations.
The target node is the node where the target element is located. In this embodiment, the markup language fragments may be parsed, and a specific parsing manner is not limited, for example, a general markup language parser is adopted. And then, identifying the plurality of analyzed nodes and determining a target node in the plurality of analyzed nodes. The naming of the flip class may be set in advance according to the actual situation, and is not limited in this embodiment. And adding a new flip class in the class list of each target node. The method has the advantages that the target nodes corresponding to the target elements can be extracted, the reverse style attributes are added to the root nodes and the target nodes of the target pages, and the purpose that when the target pages are reversely displayed, the target elements can keep the original display direction due to the fact that the target elements have the double reverse style attributes, and the reading habits of users are matched is achieved.
In some embodiments, adding a reverse style attribute to a root node and a target node of a target page to obtain a target code file may include: extracting a head node (HeadNode) in an Abstract Syntax Tree (AST); adding style nodes in the reference arrays of the head nodes, and adding reverse style texts in the style nodes to obtain a modified abstract syntax tree; and serializing the modified abstract syntax tree into a new markup language fragment, and replacing the corresponding markup language fragment in the source code file to obtain the target code file.
The head node is a node used for storing the style attribute in the abstract syntax tree. Adding a style node in a reference array of a head node, adding a text node in the reference array of the style node, and then adding a reverse style text in the text node, wherein the reverse style text can be css style text. The reverse style text is used for carrying out one-time horizontal mirror image turning on a selector corresponding to a root node of the target page and a turning type corresponding to the target node, and the selector corresponding to the root node of the target page comprises the turning type corresponding to the target node. The advantage of this arrangement is that the setting of the reverse style properties of the target page and target element can be achieved more quickly by adding the reverse style text in the head node of the abstract syntax tree.
In one embodiment, adding a reverse style attribute to a root node and a target node of a target page may include: and if the file path of the source code file corresponding to the markup language fragment is consistent with the preset initial file path, adding reverse style attributes to the root node and the target node of the target page to obtain the target code file. The preset starting file path can be a file path of a starting source code file, the pattern can be applied to all source code files during running by modifying the starting source code file, each source code file does not need to be modified, and the addition of the reverse pattern attribute is more reasonably realized.
In one embodiment, after the identifying a target node included in the markup language fragment and adding a flip class to the class list of the target node, the method further includes: and if the file path of the source code file corresponding to the markup language fragment is not consistent with the preset initial file path, returning to the source code file. That is, when the source code file corresponding to the markup language fragment is not the initial source code file, the source code file is not subjected to subsequent processing of adding the reverse style attribute.
Fig. 2 is a flowchart of another installation package generation method for a web application according to an embodiment of the present invention. On the basis of the above embodiments, the present embodiment further optimizes the installation package generation method of the web application. Correspondingly, as shown in fig. 2, the method of the embodiment specifically includes:
s201, obtaining a source code file corresponding to a target page in a packaging stage or a publishing stage of the webpage application program.
S202, extracting the markup language fragments in the source code file.
In this embodiment, extracting the markup language fragments in the source code file may include: matching the source code file according to the file suffix name; and extracting the markup language fragments in the successfully matched source code file. For the obtained source code file, the file suffix name of each source code file can be matched with the preset file suffix name, if the file suffix name of the source code file is consistent with any one of the preset file suffix names, the matching is successful, and if the file suffix name of the source code file is not consistent with the preset file suffix name, the matching is failed. The preset file suffix name can be set according to actual conditions, for example, the preset file suffix name can comprise "vue", "tsx", html "and the like. The source code files which are successfully matched are all source code files which possibly contain markup language fragments.
Because the types of the source code files which are successfully matched can be various, the markup language fragments can be extracted in different modes aiming at different types of source code files. Illustratively, the file content for a source code file with a suffix name of "vue" may be an XML structure, and the outermost template tag may be extracted. And for a source code file with unsuccessful matching, no markup language fragment exists in the source code file, and the file can be ignored.
S203, identifying the target node contained in the markup language fragment, and adding a flip class in the class list of the target node.
Wherein the target node corresponds to the target element.
Specifically, identifying the target node included in the markup language fragment may include: adopting a markup language parser to parse the markup language fragments to obtain corresponding abstract syntax trees; and identifying a target node in the abstract syntax tree according to the node attribute. The markup language parser may be a general-purpose parser, which is not limited in this embodiment, and for example, the markup language parser may be an XML parser. An abstract syntax tree is an abstract representation of the syntax structure of the source code, and can represent the syntax structure of the programming language in a tree form, wherein each node on the tree represents a structure in the source code semantics. The node Attribute (i.e., node structure) in the abstract syntax tree in this embodiment may include a node Name (Name), a reference array to a child node (Children), a Class List (Class List) and an Attribute List (Attribute List) of the current node, and the like.
And traversing the whole abstract syntax tree, identifying each node included in the abstract syntax tree according to the node attribute, and determining whether the node is a target node. Since the target node corresponds to the target element, when the target element is a picture element and a text element, the target node is a picture node and a text node. Illustratively, the following steps are performed for each node: judging whether the node name of the current node is a picture name or not, and if so, determining that the current node is a target node; if not, continuously judging whether the current node only comprises a text element, namely traversing the reference array of the current node, judging whether the node names in the reference array are all text names, if so, determining that the current node is a target node, if not, determining that the current node is not the target node, taking the next node as the current node, and returning to judge whether the new node name of the current node is a picture name. The picture naming and the text naming can be set according to actual conditions, and are not limited in this embodiment, for example, the picture naming can be img, and the text naming can be text, span or a.
S204, judging whether the file path of the source code file corresponding to the markup language fragment is consistent with a preset initial file path or not, if so, executing a step S205; otherwise, step S207 is executed.
The preset starting file path may be a file path of a starting source code file, the starting source code file refers to a file executed first in a series of source code files having a dependency relationship during operation, and a style of the file may act on a subsequent source code file. By modifying the initial source code file, the style of the initial source code file can act on all the source code files during operation, and each source code file does not need to be modified.
S205, adding reverse style attributes to the root node and the target node of the target page to obtain a target code file.
Specifically, adding a reverse style attribute to a root node and a target node of a target page to obtain a target code file may include: extracting a head node in the abstract syntax tree; adding style nodes in the reference arrays of the head nodes, and adding reverse style texts in the style nodes to obtain a modified abstract syntax tree; and serializing the modified abstract syntax tree into a new markup language fragment, and replacing the corresponding markup language fragment in the source code file to obtain the target code file.
The reverse style text is used for carrying out one-time horizontal mirror image turning on a selector corresponding to a root node of the target page and a turning type corresponding to the target node, and the selector corresponding to the root node of the target page comprises the turning type corresponding to the target node. For example, the "transform: scale (-1, 1)" style attribute may indicate that one horizontal mirror flip is performed on both selector B and flip class a corresponding to the root node of the specified target page, and since the flip class a is included in the selector B, the flip class a will be flipped twice. The selector B is a selector added by developers of different application programs to a root node of a starting target page due to the difference of language types in the development process, when the language type is English, the root node is added with a lang-en class, and when the language type is Arabic, the root node is added with a lang-ar class. Setting the selector B to be ' lang-ar ' and the flip class A to be a trans-node, the reverse style text may include ' lang-ar { transform: scale (-1, 1); lang-ar. transf-node { transform: scale (-1, 1); direction: rtl; the meaning may be that when the language type is arabic, the root node of the target page makes one horizontal mirror flip, and the node marked as a transf-node class is made one horizontal mirror flip again.
S206, generating an installation package corresponding to the webpage application program based on the target code file, so that in the running process of the webpage application program, under the condition that a preset reverse style triggering condition is met, the target page is reversely displayed based on the reverse style attribute.
In the running process of the webpage application program, under the condition that a preset reverse style triggering condition is not met, the target page is displayed in a forward direction from left to right, as shown in FIG. 3; and under the condition that the preset reverse style triggering condition is met, reversely displaying the target page from right to left as shown in FIG. 4. Fig. 3 is a schematic diagram of forward display of a web page according to an embodiment of the present invention, and fig. 4 is a schematic diagram of backward display of a web page according to an embodiment of the present invention, where elements included in the target page in fig. 3 and fig. 4 are the same, but all elements in fig. 3 are forward displayed from left to right, and other elements and layouts, etc., except for picture elements and text elements, in fig. 4 are processed as mirror images and displayed from right to left. It is to be understood that, the corresponding language types in fig. 3 and fig. 4 are different, and the text content corresponds to the language types, where "ab" and "ABCD" are only schematic in the drawings, and the corresponding languages should be displayed, for example, when the language type corresponding to fig. 4 is arabic, the "ab" and "ABCD" should be displayed in arabic.
And S207, returning a source code file.
And when the file path of the source code file corresponding to the markup language fragment is inconsistent with the preset initial file path, directly returning without modifying the current source code file.
The installation package generation scheme of the webpage application program provided by the embodiment of the invention comprises the steps of obtaining a source code file corresponding to a target page in a packaging stage or a publishing stage of the webpage application program, extracting a markup language fragment in the source code file, identifying a target node contained in the markup language fragment, adding an overturning class in a class list of the target node, if a file path of the source code file corresponding to the markup language fragment is consistent with a preset initial file path, adding a reverse style attribute to a root node and the target node of the target page to obtain the target code file, and generating an installation package corresponding to the webpage application program based on the target code file, so that the target page is reversely displayed based on the reverse style attribute in the running process of the webpage application program under the condition that a preset reverse style triggering condition is met; and if the file path of the source code file corresponding to the markup language fragment is not consistent with the preset initial file path, returning to the source code file. According to the technical scheme, reverse style attributes are added to the target page and the target elements in the target page by modifying the source code file in the webpage application program, when the webpage application program runs, if preset reverse style triggering conditions are met, the page is reversely displayed, meanwhile, the target elements can keep the original display direction and match the reading habit of a user due to the fact that the target elements have double reverse style attributes, and therefore on the basis of considering both the forward display mode and the reverse display mode, development and maintenance cost of personnel can be saved.
Fig. 5 is a schematic structural diagram of an installation package generating device for a web application according to an embodiment of the present invention, which is applicable to a situation of generating an installation package for a web application in this embodiment. The installation package generation device for the webpage application program provided by the embodiment of the invention can execute the installation package generation method for the webpage application program provided by any embodiment of the invention, and has the corresponding functional modules and beneficial effects of the execution method. The device specifically includes:
a code file obtaining module 301, configured to obtain a source code file corresponding to a target page in a web application, where the source code file is configured with a preset reverse style trigger condition;
a code file modification module 302, configured to modify the source code file to obtain a corresponding target code file, so as to add a reverse style attribute to the target page and a target element in the target page;
an installation package generating module 303, configured to generate an installation package corresponding to the web application based on the target code file, so that in an operation process of the web application, the target page is reversely displayed based on the reverse style attribute under the condition that the preset reverse style triggering condition is met.
The installation package generation device for the webpage application program, provided by the embodiment of the invention, is used for acquiring a source code file corresponding to a target page in the webpage application program, modifying the source code file to obtain a corresponding target code file, adding a reverse style attribute to the target page and a target element in the target page, and generating an installation package corresponding to the webpage application program based on the target code file, so that the target page is reversely displayed based on the reverse style attribute under the condition that a preset reverse style trigger condition is met in the running process of the webpage application program. According to the technical scheme, reverse style attributes are added to the target page and the target elements in the target page by modifying the source code file in the webpage application program, when the webpage application program runs, if preset reverse style triggering conditions are met, the page is reversely displayed, meanwhile, the target elements can keep the original display direction and match the reading habit of a user due to the fact that the target elements have double reverse style attributes, and therefore on the basis of considering both the forward display mode and the reverse display mode, development and maintenance cost of personnel can be saved.
Optionally, the preset reverse style trigger condition includes a language type.
Optionally, the code file acquiring module 301 is specifically configured to:
and acquiring a source code file corresponding to a target page in a packaging stage or a publishing stage of the webpage application program.
Optionally, the target element includes a picture element and/or a text element.
Optionally, the code file modification module 302 includes:
a markup language extracting unit, configured to extract markup language fragments in the source code file;
a target node unit, configured to identify a target node included in the markup language fragment, and add a flip class to a class list of the target node, where the target node corresponds to the target element;
and the reverse style adding unit is used for adding the reverse style attribute to the root node of the target page and the target node to obtain the target code file.
Optionally, the reverse style adding unit is specifically configured to:
and if the file path of the source code file corresponding to the markup language fragment is consistent with a preset initial file path, adding the reverse style attribute to the root node of the target page and the target node to obtain the target code file.
Optionally, the markup language extracting unit is specifically configured to:
matching the source code file according to the file suffix name;
and extracting the markup language fragments in the source code file which are successfully matched.
Optionally, the target node unit is specifically configured to:
adopting a markup language parser to parse the markup language fragments to obtain corresponding abstract syntax trees;
and identifying a target node in the abstract syntax tree according to the node attribute.
Optionally, the reverse style adding unit is specifically configured to:
extracting a head node in the abstract syntax tree;
adding style nodes in the reference arrays of the head nodes, and adding reverse style texts in the style nodes to obtain a modified abstract syntax tree;
and serializing the modified abstract syntax tree into a new markup language fragment, and replacing the corresponding markup language fragment in the source code file to obtain the target code file.
Optionally, the reverse style text is used to perform one horizontal mirror image flipping on a selector corresponding to a root node of the target page and a flipping type corresponding to the target node, where the selector corresponding to the root node of the target page includes the flipping type corresponding to the target node.
Optionally, the code file modification module 302 further includes:
and the file returning unit is used for returning the source code file if the file path of the source code file corresponding to the markup language fragment is inconsistent with a preset initial file path after identifying the target node contained in the markup language fragment and adding the flip class in the class list of the target node.
Optionally, the target element is set at a development stage of the web application.
The installation package generation device for the webpage application program provided by the embodiment of the invention can execute the installation package generation method for the webpage application program provided by any embodiment of the invention, and has the corresponding functional modules and beneficial effects of the execution method.
The embodiment of the invention also provides a storage medium containing computer executable instructions, and the computer executable instructions are used for executing the installation package generation method of the webpage application program provided by the embodiment of the invention when being executed by a computer processor.
Storage medium-any of various types of memory devices or storage devices. The term "storage medium" is intended to include: mounting media such as CD-ROM, floppy disk, or tape devices; computer system memory or random access memory such as DRAM, DDRRAM, SRAM, EDORAM, Lanbas (Rambus) RAM, etc.; non-volatile memory such as flash memory, magnetic media (e.g., hard disk or optical storage); registers or other similar types of memory elements, etc. The storage medium may also include other types of memory or combinations thereof. In addition, the storage medium may be located in a first computer system in which the program is executed, or may be located in a different second computer system connected to the first computer system through a network (such as the internet). The second computer system may provide program instructions to the first computer for execution. The term "storage medium" may include two or more storage media that may reside in different locations, such as in different computer systems that are connected by a network. The storage medium may store program instructions (e.g., embodied as a computer program) that are executable by one or more processors.
The embodiment of the invention provides computer equipment, and the computer equipment can be integrated with an installation package generation device of a webpage application program provided by the embodiment of the invention. Fig. 6 is a block diagram of a computer device according to an embodiment of the present invention. The computer device 400 comprises a memory 401, a processor 402 and a computer program stored on the memory 401 and operable on the processor 402, wherein the processor 402 implements the installation package generation method of the web application provided by the embodiment of the invention when executing the computer program.
The installation package generation device, the storage medium and the computer device of the web application program provided in the above embodiments may execute the method provided in the corresponding embodiments of the present invention, and have the functional modules and the beneficial effects corresponding to the execution method. For technical details which are not described in detail in the above-mentioned embodiments, reference may be made to the methods provided in the corresponding embodiments of the present invention.
It is to be noted that the foregoing is only illustrative of the preferred embodiments of the present invention and the technical principles employed. It will be understood by those skilled in the art that the present invention is not limited to the particular embodiments described herein, but is capable of various obvious changes, rearrangements and substitutions as will now become apparent to those skilled in the art without departing from the scope of the invention. Therefore, although the present invention has been described in greater detail by the above embodiments, the present invention is not limited to the above embodiments, and may include other equivalent embodiments without departing from the spirit of the present invention, and the scope of the present invention is determined by the scope of the appended claims.
Claims (15)
1. A method for generating an installation package of a webpage application program is characterized by comprising the following steps:
acquiring a source code file corresponding to a target page in a webpage application program, wherein the source code file is configured with a preset reverse style triggering condition;
modifying the source code file to obtain a corresponding target code file so as to add reverse style attributes to the target page and the target elements in the target page;
and generating an installation package corresponding to the webpage application program based on the target code file, so that the target page is reversely displayed based on the reverse style attribute under the condition that the preset reverse style triggering condition is met in the running process of the webpage application program.
2. The method according to claim 1, wherein the preset reverse style trigger condition comprises a language type.
3. The method of claim 1, wherein obtaining the source code file corresponding to the target page in the web application comprises:
and acquiring a source code file corresponding to a target page in a packaging stage or a publishing stage of the webpage application program.
4. The method of claim 1, wherein the target element comprises a picture element and/or a text element.
5. The method of claim 1, wherein modifying the source code file to obtain a corresponding object code file comprises:
extracting a markup language fragment in the source code file;
identifying a target node contained in the markup language fragment, and adding a turnover class in a class list of the target node, wherein the target node corresponds to the target element;
and adding the reverse style attribute to the root node of the target page and the target node to obtain the target code file.
6. The method of claim 5, wherein adding the reverse style attribute to the root node and the target node of the target page comprises:
and if the file path of the source code file corresponding to the markup language fragment is consistent with a preset initial file path, adding the reverse style attribute to the root node of the target page and the target node to obtain the target code file.
7. The method of claim 5, wherein extracting markup language fragments from the source code file comprises:
matching the source code file according to the file suffix name;
and extracting the markup language fragments in the source code file which are successfully matched.
8. The method of claim 5, wherein identifying the target node contained in the markup language fragment comprises:
adopting a markup language parser to parse the markup language fragments to obtain corresponding abstract syntax trees;
and identifying a target node in the abstract syntax tree according to the node attribute.
9. The method of claim 8, wherein adding the reverse style attribute to the root node and the target node of the target page to obtain the target code file comprises:
extracting a head node in the abstract syntax tree;
adding style nodes in the reference arrays of the head nodes, and adding reverse style texts in the style nodes to obtain a modified abstract syntax tree;
and serializing the modified abstract syntax tree into a new markup language fragment, and replacing the corresponding markup language fragment in the source code file to obtain the target code file.
10. The method according to claim 9, wherein the reverse style text is used for performing one horizontal mirror image flipping on a selector corresponding to a root node of the target page and a flipping class corresponding to the target node, and the selector corresponding to the root node of the target page includes the flipping class corresponding to the target node.
11. The method according to claim 6, wherein after said identifying a target node contained in said markup language fragment and adding a flip class to a class list of said target node, further comprising:
and if the file path of the source code file corresponding to the markup language fragment is not consistent with the preset initial file path, returning to the source code file.
12. The method of claim 1, wherein the target element is set during a development phase of the web application.
13. An installation package generating apparatus for a web application, comprising:
the code file acquisition module is used for acquiring a source code file corresponding to a target page in a webpage application program, and the source code file is configured with a preset reverse style trigger condition;
the code file modification module is used for modifying the source code file to obtain a corresponding target code file so as to add reverse style attributes to the target page and the target elements in the target page;
and the installation package generation module is used for generating an installation package corresponding to the webpage application program based on the target code file so as to reversely display the target page based on the reverse style attribute under the condition that the preset reverse style triggering condition is met in the running process of the webpage application program.
14. A computer-readable storage medium, on which a computer program is stored which, when being executed by a processor, carries out the method according to any one of claims 1-12.
15. A computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, characterized in that the processor implements the method according to any of claims 1-12 when executing the computer program.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201911351021.7A CN111124481A (en) | 2019-12-24 | 2019-12-24 | Installation package generation method and device of webpage application program, storage medium and equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201911351021.7A CN111124481A (en) | 2019-12-24 | 2019-12-24 | Installation package generation method and device of webpage application program, storage medium and equipment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111124481A true CN111124481A (en) | 2020-05-08 |
Family
ID=70502050
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201911351021.7A Pending CN111124481A (en) | 2019-12-24 | 2019-12-24 | Installation package generation method and device of webpage application program, storage medium and equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111124481A (en) |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111736829A (en) * | 2020-06-16 | 2020-10-02 | 上海英方软件股份有限公司 | Method and device for switching page style based on Web internationalization |
| CN111782333A (en) * | 2020-07-28 | 2020-10-16 | 网易（杭州）网络有限公司 | Interface display method and device in game, storage medium and terminal equipment |
| CN113535181A (en) * | 2021-06-23 | 2021-10-22 | 北京达佳互联信息技术有限公司 | File processing method and device, electronic equipment, storage medium and product |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101051270A (en) * | 2007-05-11 | 2007-10-10 | 华为技术有限公司 | Interface layout changing method and interface display controller |
| CN101882148A (en) * | 2010-05-24 | 2010-11-10 | 中国科学院计算技术研究所 | Method and system thereof for automatically identifying Uyghur in web page |
| CN103399720A (en) * | 2013-07-16 | 2013-11-20 | 青岛海信信芯科技有限公司 | Data processing method and electronic equipment |
| CN104166574A (en) * | 2014-08-18 | 2014-11-26 | 深圳市九洲电器有限公司 | Interface display method and system |
-
2019
- 2019-12-24 CN CN201911351021.7A patent/CN111124481A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101051270A (en) * | 2007-05-11 | 2007-10-10 | 华为技术有限公司 | Interface layout changing method and interface display controller |
| CN101882148A (en) * | 2010-05-24 | 2010-11-10 | 中国科学院计算技术研究所 | Method and system thereof for automatically identifying Uyghur in web page |
| CN103399720A (en) * | 2013-07-16 | 2013-11-20 | 青岛海信信芯科技有限公司 | Data processing method and electronic equipment |
| CN104166574A (en) * | 2014-08-18 | 2014-11-26 | 深圳市九洲电器有限公司 | Interface display method and system |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111736829A (en) * | 2020-06-16 | 2020-10-02 | 上海英方软件股份有限公司 | Method and device for switching page style based on Web internationalization |
| CN111782333A (en) * | 2020-07-28 | 2020-10-16 | 网易（杭州）网络有限公司 | Interface display method and device in game, storage medium and terminal equipment |
| CN111782333B (en) * | 2020-07-28 | 2022-05-31 | 网易（杭州）网络有限公司 | Interface display method and device in game, storage medium and terminal equipment |
| CN113535181A (en) * | 2021-06-23 | 2021-10-22 | 北京达佳互联信息技术有限公司 | File processing method and device, electronic equipment, storage medium and product |
| CN113535181B (en) * | 2021-06-23 | 2022-04-29 | 北京达佳互联信息技术有限公司 | File processing method and device, electronic equipment, storage medium and product |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10325012B2 (en) | Filtered stylesheets | |
| WO2017124952A1 (en) | Webpage script loading method and device | |
| US8397159B2 (en) | Method and apparatus for solving UI style conflicts in web application composition | |
| US20150082298A1 (en) | Packaging and deploying hybrid applications | |
| US9128723B2 (en) | Method and apparatus for dynamic document object model (DOM) aware code editing | |
| US20120110437A1 (en) | Style and layout caching of web content | |
| CN108762743B (en) | Data table operation code generation method and device | |
| US7784026B1 (en) | Web application internationalization | |
| CN111124481A (en) | Installation package generation method and device of webpage application program, storage medium and equipment | |
| US9069829B2 (en) | Data items manager | |
| EP2724258A2 (en) | Dynamically updating a running page | |
| US20120072831A1 (en) | Method for creating a multi-lingual web page | |
| CN111241793B (en) | Method, system and medium for resolving rich text editor content to render to native client | |
| CN108132954B (en) | Localized loading method and device for HTML (Hypertext markup language) page | |
| CN105683957B (en) | Stylesheet speculative preloading | |
| CN110888645A (en) | Method, device and storage medium for converting into small program | |
| CN111831384A (en) | Language switching method and device, equipment and storage medium | |
| US11119896B1 (en) | Browser based visual debugging | |
| US9141344B2 (en) | Hover help support for application source code | |
| CN109710224B (en) | Page processing method, device, equipment and storage medium | |
| US20130124969A1 (en) | Xml editor within a wysiwyg application | |
| US11403078B2 (en) | Interface layout interference detection | |
| CN110347390B (en) | Method, storage medium, equipment and system for rapidly generating WEB page | |
| CN111984262A (en) | WeChat cascading style sheet file processing method, device, equipment and storage medium | |
| US20200279021A1 (en) | Dynamically adjusting text strings based on machine translation feedback |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200508 |
|
| RJ01 | Rejection of invention patent application after publication |