Web component generation method and device, medium and electronic equipment

Abstract

The invention discloses a Web component generation method and device, a medium and electronic equipment, and the method comprises the steps: firstly, determining an original component library and a frame of the original component library, secondly, determining a component conversion method corresponding to the frame of the original component library according to a preset corresponding relation between each frame and the component conversion method and the frame of the original component library, and generating a Web component according to the component conversion method. The method comprises the steps that firstly, an original component library is established, functional components and all public components are determined from the original component library, then, the functional components are converted into functional elements through a component conversion method, all the public components are converted into slot elements through the component conversion method, and finally, the functional elements and the slot elements are packaged to obtain a target component. According to the method, each slot element is reused, the component generation efficiency is improved, and the development efficiency of a user is improved.

Description

Technical Field

[0001] This specification relates to the field of computer technology, and in particular to a method, device, medium, and electronic device for generating a Web component. Background Art

[0002] In recent years, with the development of computer technology, World Wide Web (Web) applications have also made progress. Web applications are applications accessed and used using a web browser. To improve the accessibility, interoperability, sustainability, and security of Web applications and to meet evolving needs, Web standards for Web applications have emerged.

[0003] Currently, components that comply with Web standards (Web-Components) are highly reusable, allowing the use of exactly the same components in different Web applications, greatly improving the development efficiency of Web applications.

[0004] However, since the number of publicly available components that conform to Web standards is small and the supported functions are relatively simple, it is difficult to meet the development needs of Web applications. Therefore, this specification provides a method for generating a Web component. Summary of the Invention

[0005] This specification provides a method, device, storage medium, and electronic device for generating a Web component to at least partially solve the above-mentioned problems existing in the prior art.

[0006] This manual adopts the following technical solutions:

[0007] This specification provides a method for generating a web component, the method comprising:

[0008] Obtaining an original component library and a framework of the original component library;

[0009] Determining a component conversion method corresponding to the framework of the original component library and each functional component included in the original component library, wherein the component conversion method is used to convert the original component into a Web component;

[0010] For each functional component, determine the common components that support the functional component according to the framework of the original component library;

[0011] By means of the component conversion method, the functional components are converted into functional elements, and the common components are converted into slot elements;

[0012] Determining the correspondence between the functional elements and the slot elements according to the correspondence between the functional components and the common components in the framework of the original component library;

[0013] For each functional element, according to the corresponding relationship between the functional element and the slot elements, the functional element is assembled with the slot elements corresponding to the functional element to obtain a target component.

[0014] Optionally, assembling the functional element with the slot elements corresponding to the functional element according to the correspondence between the functional element and the slot elements specifically includes:

[0015] Combining the slot elements with the preset templates in the component conversion method to obtain a universal element, and establishing a corresponding relationship between the universal element and the slot elements;

[0016] According to the correspondence between the functional elements and the slot elements, and the correspondence between the universal elements and the slot elements, the correspondence between the functional elements and the universal elements is determined through the common slot elements;

[0017] According to the correspondence between the functional element and the universal element, the functional element is assembled with the universal element corresponding to the functional element.

[0018] Optionally, converting the functional component into a functional element and converting each common component into a slot element by the component conversion method specifically includes:

[0019] Converting each functional component into a functional element by using the functional component conversion method in the component conversion method;

[0020] The common component groups are converted into slot elements through the common component conversion method in the component conversion method.

[0021] Optionally, converting each common component into a slot element through the component conversion method specifically includes:

[0022] Determining dependencies of the functional component;

[0023] The common component including the path for calling each dependency is converted into a slot element by the component conversion method.

[0024] Optionally, determining each functional component included in the original component library specifically includes:

[0025] Determining classification conditions for each functional component in the original component;

[0026] Classify each original component according to the classification conditions to determine the functional components in the original component library;

[0027] Other original components other than the functional components in the original component library are determined as public components.

[0028] Optionally, after determining the component conversion method corresponding to the framework of the original component library and the functional components included in the original component library, the method further includes:

[0029] In response to the update instruction of the original component, determining a newly added functional component as a newly added component;

[0030] Determine the component conversion method corresponding to the newly added component;

[0031] Determining the corresponding relationship between the newly added component and each common component according to the framework of the original component library;

[0032] Convert the newly added component into a newly added element using the component conversion method corresponding to the newly added component;

[0033] Determining the correspondence between the newly added element and each slot element according to the correspondence between the newly added component and each common component in the framework of the original component library;

[0034] According to the correspondence between the newly added element and the elements in each slot, the newly added element is assembled with the elements in each slot corresponding to the newly added element to obtain a target component.

[0035] Optionally, after determining the component conversion method corresponding to the framework of the original component library and the functional components included in the original component library, the method further includes:

[0036] In response to the update instruction of the original component, determining a newly added common component as the newly added common component;

[0037] Determine the component conversion method corresponding to the newly added common component and the framework for updating the original component library;

[0038] Convert each newly added common component into a newly added slot element using the component conversion method corresponding to the newly added common component;

[0039] Determining the correspondence between the functional components and the common components including the newly added common components, and determining the correspondence between the functional elements and the slot elements including the newly added slot elements, based on the updated framework of the original component library;

[0040] According to the correspondence between the functional element and each slot element, the functional element is assembled with each slot element corresponding to the functional element to obtain a target component.

[0041] This specification provides a device for generating a web component, the device comprising:

[0042] A determination module is provided to obtain an original component library and a framework of the original component library, determine a component conversion method corresponding to the framework of the original component library, and various functional components included in the original component library, wherein the component conversion method is used to convert the original component into a Web component;

[0043] Select a module and, for each functional component, determine the common components that support the functional component according to the framework of the original component library;

[0044] A conversion module, which converts the functional components into functional elements and converts the common components into slot elements through the component conversion method;

[0045] A corresponding module determines the corresponding relationship between the functional element and each slot element according to the corresponding relationship between the functional component and each common component in the framework of the original component library;

[0046] The encapsulation module assembles each functional element with the slot elements corresponding to the functional element according to the corresponding relationship between the functional element and the slot elements to obtain a target component.

[0047] This specification provides a computer-readable storage medium storing a computer program. When the computer program is executed by a processor, the method for automatically generating the target component is implemented.

[0048] This specification provides an electronic device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor implements the above-mentioned method for automatically generating a target component when executing the program.

[0049] At least one of the above technical solutions adopted in this specification can achieve the following beneficial effects:

[0050] In the automatic generation method of the target component provided in this specification, the original component library and the framework of the original component library are first determined. Secondly, according to the preset correspondence between each framework and the component conversion method and the framework of the original component library, the component conversion method corresponding to the framework of the original component library is determined, and the functional components and each common component are determined from the original component library. Again, through the component conversion method, the functional components are converted into functional elements, and through the component conversion method, the common components are converted into slot elements. Finally, the functional elements and slot elements are encapsulated to obtain the target component.

[0051] This method improves the user's development efficiency by reusing various slot elements during the packaging process to improve the component generation efficiency. BRIEF DESCRIPTION OF THE DRAWINGS

[0052] The drawings described herein are used to provide a further understanding of this specification and constitute a part of this specification. The exemplary embodiments and descriptions of this specification are used to explain this specification and do not constitute an improper limitation of this specification. In the drawings:

[0053] Figure 1 A flowchart of a method for generating a web component provided in this specification;

[0054] Figure 2 A flowchart of a method for automatically generating a target component based on a Vue2 component provided in this manual;

[0055] Figure 3 A flowchart of another method for generating a web component provided in this manual;

[0056] Figure 4 A schematic diagram of a device for generating a web component provided in this specification;

[0057] Figure 5 The corresponding Figure 1 Schematic diagram of electronic equipment. DETAILED DESCRIPTION

[0058] To make the purpose, technical solutions, and advantages of this specification more clear, the technical solutions of this specification will be clearly and completely described below in conjunction with the specific embodiments of this specification and the corresponding drawings. Obviously, the embodiments described are only part of the embodiments of this specification, not all of the embodiments. Based on the embodiments in this specification, all other embodiments obtained by ordinary technicians in this field without making any creative efforts are within the scope of protection of this application.

[0059] The technical solutions provided by the embodiments of this specification are described in detail below with reference to the accompanying drawings.

[0060] Figure 1 The following is a flowchart of a method for generating a web component in this specification, which specifically includes the following steps:

[0061] S101: Acquire an original component library and a framework of the original component library.

[0062] Currently, in order to improve the accessibility, interoperability, sustainability and security of web applications, new web standards have been born. Among them, web standards include at least: custom elements (Custom Elements) and HTML templates (HyperText Markup Language Templates, HTML Templates). Custom elements use the class keyword to define a class that inherits from HTMLElement to implement specific behaviors and logic in the class, and register new elements through the customElements.define() method. Among them, HTML templates are defined through <template>Elements, define a set of DOM structures, and can be copied by calling the .cloneNode(true) method <template>The content of the element, returns a <template>The new node of the content, as a template, can be cloned and inserted into any position in the document. By meeting these standards, Web components are powerful and flexible when building UI components. Among them, UI components are the components of Web applications, forming the core building blocks of the user interface. They are usually responsible for presenting visual interactive elements and processing user input, and have specific functions and appearances. They can be reused in different places, such as buttons, forms, modal dialog boxes, etc. However, for users of Web components, the number of Web components in the Web component library that stores Web components is too small, resulting in Web components providing fewer functions than other framework components. When users need to use specific functions that are not provided by the Web component library, they can only implement the specified functions through manual coding based on personal experience, which greatly reduces the user's development efficiency.

[0063] To this end, this specification provides a method for generating a web component. Based on existing non-web framework components, this method generates target components corresponding to the functionality of other framework components. This target component generation process can be performed by computing devices such as personal computers, mobile terminals, and servers. This specification does not limit the specific device used to perform the data visualization process. For the sake of uniformity, this specification uses a server executing this network link data visualization method as an example.

[0064] The server first determines the original component library of the non-target component library and the framework of the original component library. At the same time, it determines whether the original component library is identified by the framework. For example, if the server determines that the original component library is a component library for the Vue2 environment, the framework of the original component library will match the Vue2 framework.

[0065] S103: Determine a component conversion method corresponding to the framework of the original component library and each functional component included in the original component library, wherein the component conversion method is used to convert the original component into a Web component.

[0066] After determining the original component library and the framework of the original component library, the server determines the correspondence between the preset frameworks and the component conversion methods, and determines the component conversion method corresponding to the framework of the original component library, so as to use the component conversion method in subsequent steps to convert the original components in the original component library into components of the target component.

[0067] In addition, while the server determines the component conversion method, the server also determines functional components with different functions from the original components stored in the original component library as source components of the custom elements in the target component, and determines the common components responsible for the functional execution environment as multiple source components of the HTML template.

[0068] It's important to note that the pre-set correspondence between frameworks and component conversion methods is a pre-set, framework-indexed table. Each framework corresponds to at least one method for converting it into a custom element or HTML template in the target component. Specific conversion methods are disclosed in the community component libraries of each framework component library and are not limited in this specification. You can select as needed.

[0069] S105: For each functional component, determine the common components that support the functional component according to the framework of the original component library.

[0070] S107: Convert the functional components into functional elements and convert the common components into slot elements through the component conversion method.

[0071] The server converts the functional components identified in the original component library into custom elements according to the determined component conversion method. In this specification, the converted custom elements are referred to as functional elements. Furthermore, based on the functional component's operational logic and the component conversion method, the server sequentially converts each common component identified in the original component library into portions of the HTML template, following the HTML template's operational logic, to obtain slot elements, enabling the target component to independently implement the functional component's functionality.

[0072] It should be noted that the conversion of each common component into a slot element is to enable the target component to independently implement the function of the functional element. Generally speaking, multiple common components are converted into one slot element. However, when it is necessary to display different contents of the functional element according to different conditions or states, the user can pre-set the number and type of converted slot elements so that the functional element can be displayed through different slot elements under different conditions or states to meet the specific situation. Therefore, the specific conversion method is not limited to the number and type of slot elements, and can be selected as needed.

[0073] S109: Determine the corresponding relationship between the functional elements and the slot elements according to the corresponding relationship between the functional components and the common components in the framework of the original component library.

[0074] The server determines the correspondence between the functional components and the public components in the framework of the original component library through "determining the public components that support the functional component according to the framework of the original component library" in step S105, and determines the correspondence between the functional elements and the slot elements after the conversion is completed according to the determined correspondence.

[0075] It should be noted that steps S107 and S109 do not have a strict order. In other words, the server can perform the conversion after determining the corresponding relationship in step S109, and the method will still achieve its effect. Therefore, this specification does not limit whether step S107 or step S109 is performed first, and the decision can be made as needed.

[0076] S111: For each functional element, according to the correspondence between the functional element and the slot elements, assemble the functional element with the slot elements corresponding to the functional element to obtain a target component.

[0077] The server encapsulates the converted functional elements and slot elements into a target component to obtain a complete target component having the functions of the functional component.

[0078] based on Figure 1 The automatic generation method of the target component shown can be achieved by: first determining the original component library and the framework of the original component library, secondly, determining the component conversion method corresponding to the framework of the original component library according to the preset correspondence between each framework and the component conversion method and the framework of the original component library, and determining the functional components and each common component from the original component library, again, through the component conversion method, converting the functional components into functional elements, and through the component conversion method, converting each common component into slot elements, finally, encapsulating the functional elements and slot elements to obtain the target component method, and automatically converting the functional components with specified functions into the target component method, thereby improving the user's development efficiency.

[0079] In one or more embodiments of this specification, a flowchart of a method for automatically generating a target component based on a Vue2 component is also provided, such as Figure 2 As shown, the server first determines that the original component library is the Vue2 component library. Secondly, based on the preset correspondence between each framework and the component conversion method, the conversion method of the Vue2 component is determined. From the Vue2 component library, the components including api, utils, severSelector, and store are identified as common components, and the components including Header, Lottery, or GetGift are identified as functional components. Thirdly, according to the conversion method of the Vue2 component, the determined functional components are converted into functional elements in the form of Header, Lottery, GetGift, etc. According to the dist / common / index.js strategy, the functional elements are placed in the JavaScript file in the dist directory. Then, using the component conversion method, each common component is converted into a slot element with Vue's mounting method, tool class, global state manager, basic API, and other functions. According to the dist / component type / component name / index.js strategy, the slot elements are placed in the JavaScript file in the dist directory. Finally, using the PHP template engine Smarty, the functional elements and slot elements are encapsulated to obtain the target component.

[0080] In one or more embodiments of the present specification, a method for converting a functional component in a Vue3 component library into a custom element is also provided: First, the server imports the defineCustomElement function, which allows a Vue3 component to be converted into a custom element. Secondly, a Vue 3 component named MyComponent is imported. Again, the defineCustomElement function is used to convert MyComponent into a custom element, where MyComponentElement is a constructor that can be registered as a custom element. Finally, the customElements.define method is used to register MyComponentElement as a custom element named my-component, which enables it to be used in HTML templates. <my-component>The above conversion method converts a Vue 3 component and registers it as a custom element, taking full advantage of the target component while retaining the powerful features of the Vue 3 framework.

[0081] In one or more embodiments of the present specification, a method for converting functional components in a react component library into custom elements is also provided: first, the server imports the react component, renders the react component into the DOM, and defines it as MyComponent. Secondly, inherit the MyWebComponent class from HTMLElement and call the connectedCallback method. Again, create a new span element as the mounting point of the React component, and, for the convenience of testing and customization, attach a shadow root to the current target component, where the mode is "open", and then add the span element (mounting point) to the shadow root. Again, by obtaining the value of the name attribute from the custom target component, determine the data to be passed to the React component, and pass the name attribute to MyComponent by rendering the MyComponent React component into the span element (mounting point). Finally, register the custom target component.

[0082] In the above step S111, in order to assemble faster, the server can obtain the common element by combining each slot element with the preset template in the component conversion method, and establish the corresponding relationship between the common element and each slot element. Secondly, according to the corresponding relationship between the functional element and each slot element, and the corresponding relationship between the common element and each slot element, the corresponding relationship between the functional element and the common element is determined through the common slot elements. Thirdly, according to the corresponding relationship between the functional element and the common element, the common element corresponding to the functional element is assembled.

[0083] In step S107, in order to improve the conversion efficiency of the component, each functional component is converted into a functional element through the functional component conversion method in the component conversion method. Secondly, each common component group is converted into each slot element through the common component conversion method in the component conversion method.

[0084] In step S107, because normal components rely on public components to directly monitor and use their dependencies, this method requires that the public components be provided with this correspondence; otherwise, the public components will not take effect. The server can determine the dependencies of the functional component and then, using the component conversion method, convert the public component containing the path to call each dependency into a slot element.

[0085] In step S107, to more quickly identify common components, the server first determines the classification criteria for each functional component in the original component library. Next, the server classifies each original component according to the classification criteria to determine the functional components in the original component library. Finally, the original components in the original component library that are not functional components are treated as common components.

[0086] Specifically, the server selects the classification conditions of each type of functional component from each original component and selects the functional component of this type. After filtering the conditions of each type respectively, the original component that does not hit any classification condition is the public component.

[0087] After determining the functional components in the above step S103, the present method can assemble more target components by updating. The server first responds to the update instruction of the original component and determines the newly added functional components as the newly added components. Secondly, the component conversion method corresponding to the newly added components is determined. Again, according to the framework of the original component library, the corresponding relationship between the newly added components and the public components is determined. Again, the newly added components are converted into newly added elements by the component conversion method corresponding to the newly added components. Again, according to the corresponding relationship between the newly added components and the public components in the framework of the original component library, the corresponding relationship between the newly added elements and the slot elements is determined. Finally, according to the corresponding relationship between the newly added elements and the slot elements, the newly added elements are assembled with the slot elements corresponding to the newly added elements to obtain the target component.

[0088] Similar to the above-mentioned update method, after determining the functional components in the above-mentioned step S103, in order to improve the efficiency of obtaining the target component, the server can also separately update the combination of slot elements and functional elements. First, the server responds to the update instruction of the original component and determines the newly added common component as the newly added common component. Secondly, the component conversion method corresponding to the newly added common component and the updated framework of the original component library are determined; each newly added common component is converted into a newly added slot element by the component conversion method corresponding to the newly added common component. Thirdly, according to the updated framework of the original component library, the corresponding relationship between the functional component and each common component including the newly added common component is determined, and the corresponding relationship between the functional element and each slot element including the newly added slot element is determined. Finally, according to the corresponding relationship between the functional element and each slot element, the functional element is assembled with each slot element corresponding to the functional element to obtain the target component.

[0089] After determining the functional components in step S103, the server determines a functional component definition method and a common component definition method based on the component conversion method to accurately distinguish between the functional components and the common components. The server defines the functional components based on the functional component definition method and defines the common components based on the common component definition method.

[0090] Accordingly, before defining a functional component, its performance can be improved. In response to an input update method, the server first adjusts the functional component according to the update method. Next, it runs the adjusted functional component within the framework. Finally, when the adjusted functional component is running normally, the adjusted functional component is defined.

[0091] In one or more embodiments of this specification, a flowchart for obtaining a target component is also provided, such as Figure 3 As shown, the server first determines the original component library. Next, it determines a conversion method based on the preset correspondence between each framework and the component conversion method. It then identifies common components and functional components from the original component library. Third, it adjusts and defines the determined functional components. Third, based on the conversion method, it converts the determined functional components into functional elements. Finally, it encapsulates the functional elements and the slot elements to obtain the target component.

[0092] In step S105, when the server determines that the syntax of the functional component is different from the preset target component syntax, resulting in the inability to successfully convert the functional component using the preset conversion method, the server determines the syntax of the functional component, introduces a preset auxiliary module into the functional component, and redefines the functional component.

[0093] In one or more embodiments of the present specification, the server may introduce a preset ESM module through an ESM module that implements the ESM standard () to redefine the functional components.

[0094] Correspondingly, in the above step S105, the server converts the re-determined functional components into functional elements through a component conversion method.

[0095] Correspondingly, when the functional component obtained after converting the syntax through the above steps cannot run normally, the server determines that the functional component of the preset auxiliary module has not been introduced. The functional component is converted using the preset build tool and the converted functional component is packaged.

[0096] In one or more embodiments of this specification, the server converts and packages functional components using the Browserify tool as a build tool and Webpack, which packages the products of the Browserify tool. Alternatively, the default build tool is Webpack or Rollup, both of which can achieve the packaging and conversion of functional components.

[0097] Correspondingly, in the above step S105, the server converts the packaged functional components into functional elements through the component conversion method.

[0098] In the above step S103, in order to accurately match the functional component, the server responds to the input functional identifier and determines the original component matching the functional identifier from the original components in the original component library as the functional component.

[0099] Figure 4 A device for generating a web component provided in this specification specifically includes:

[0100] Determination module 201, obtaining an original component library and a framework of the original component library, determining a component conversion method corresponding to the framework of the original component library and each functional component included in the original component library, wherein the component conversion method is used to convert the original component into a Web component;

[0101] The selection module 203 determines, for each functional component, the common components that support the functional component according to the framework of the original component library;

[0102] The conversion module 205 converts the functional components into functional elements and converts the common components into slot elements through the component conversion method.

[0103] The corresponding module 207 determines the corresponding relationship between the functional element and each slot element according to the corresponding relationship between the functional component and each common component in the framework of the original component library;

[0104] The encapsulation module 209 assembles each functional element with the slot elements corresponding to the functional element according to the corresponding relationship between the functional element and the slot elements to obtain a target component.

[0105] Optionally, the encapsulation module 209 is used to combine each slot element with a preset template in the component conversion method to obtain a slot element, and establish a correspondence between the slot element and each slot element. According to the correspondence between the functional element and each slot element, and the correspondence between the slot element and each slot element, the correspondence between the functional element and the slot element is determined through the common slot elements. According to the correspondence between the functional element and the slot element, the slot element corresponding to the functional element is assembled.

[0106] Optionally, the conversion module 205 is used to convert each functional component into a functional element through a functional component conversion method in the component conversion method, and convert each common component group into each slot element through a common component conversion method in the component conversion method.

[0107] Optionally, the conversion module 205 is used to determine the classification conditions of each functional component in the original component, classify each original component according to each classification condition, determine the functional components in the original component library, and use other original components in the original component library that are determined to be functional components as public components.

[0108] Optionally, the device also includes an update module 213, which is used to respond to the update instruction of the original component, determine the newly added functional component as the newly added component, determine the component conversion method corresponding to the newly added component, determine the correspondence between the newly added component and each public component according to the framework of the original component library, convert the newly added component into a newly added element through the component conversion method corresponding to the newly added component, determine the correspondence between the newly added element and each slot element according to the correspondence between the newly added component and each public component in the framework of the original component library, and assemble the newly added element with each slot element corresponding to the newly added element according to the correspondence between the newly added component and each slot element to obtain the target component.

[0109] Optionally, the update module 213 is used to respond to the update instruction of the original component, determine the newly added common component as the newly added common component, determine the component conversion method corresponding to the newly added common component, and the framework of the original component library update, and convert each newly added common component into a newly added slot element through the component conversion method corresponding to the newly added common component, and determine the correspondence between the functional component and each public component including the newly added common component according to the framework of the original component library update, and determine the correspondence between the functional element and each slot element including the newly added slot element, and assemble the functional element with each slot element corresponding to the functional element according to the correspondence between the functional element and each slot element to obtain the target component.

[0110] This specification also provides a computer-readable storage medium, which stores a computer program that can be used to execute the above Figure 1 Provides an automatic generation method for the target component.

[0111] This manual also provides Figure 5 The schematic structure diagram of the electronic device shown in FIG. Figure 5 As mentioned above, at the hardware level, the electronic device includes a processor, an internal bus, a network interface, a memory and a non-volatile memory, and may also include other hardware required for the business. The processor reads the corresponding computer program from the non-volatile memory into the memory and then runs it to achieve the above Figure 1 Of course, in addition to software implementation, this specification does not exclude other implementation methods, such as logic devices or a combination of software and hardware, etc., that is, the execution subject of the following processing flow is not limited to each logic unit, but can also be hardware or logic devices.

[0112] Improvements to a technology can be clearly distinguished as either hardware improvements (for example, improvements to circuit structures such as diodes, transistors, and switches) or software improvements (improvements to process flows). However, with technological advancements, many process flow improvements today can now be considered direct improvements to hardware circuit structures. Designers almost always program the improved process flow into the hardware circuit to obtain the corresponding hardware circuit structure. Therefore, it cannot be said that a process flow improvement cannot be implemented using a hardware module. For example, a programmable logic device (PLD), such as a field programmable gate array (FPGA), is an integrated circuit whose logical function is determined by user programming. Designers can "integrate" a digital system onto a PLD through their own programming, eliminating the need for chip manufacturers to design and manufacture dedicated integrated circuit chips. Moreover, nowadays, instead of manually fabricating integrated circuit chips, this programming is mostly performed using "logic compiler" software. This is similar to the software compiler used during program development. Before compilation, the original code must also be written in a specific programming language, called a hardware description language (HDL). There are not just one HDL, but many, such as ABEL (Advanced Boolean Expression Language), AHDL (Altera Hardware Description Language), Confluence, CUPL (Cornell University Programming Language), HDCal, JHDL (Java Hardware Description Language), Lava, Lola, MyHDL, PALASM, and RHDL (Ruby Hardware Description Language). Currently, the most commonly used are VHDL (Very-High-Speed Integrated Circuit Hardware Description Language) and Verilog. Those skilled in the art will also understand that by simply programming the method flow in one of these hardware description languages and then programming it into an integrated circuit, a hardware circuit that implements the logic method flow can be easily obtained.

[0113] The controller can be implemented in any suitable manner. For example, the controller can take the form of a microprocessor or processor and a computer-readable medium storing computer-readable program code (e.g., software or firmware) executable by the (micro)processor, logic gates, switches, application-specific integrated circuits (ASICs), programmable logic controllers, and embedded microcontrollers. Examples of controllers include, but are not limited to, the following microcontrollers: ARC 625D, Atmel AT91SAM, Microchip PIC18F26K20, and Silicone Labs C8051F320. The memory controller can also be implemented as part of the control logic of the memory. Those skilled in the art will also know that in addition to implementing the controller in a purely computer-readable program code format, the controller can be implemented in the form of logic gates, switches, application-specific integrated circuits, programmable logic controllers, and embedded microcontrollers by logically programming the method steps. Therefore, such a controller can be considered a hardware component, and the devices included therein for implementing various functions can also be considered as structures within the hardware component. Or even, the devices for implementing various functions can be considered as both software modules that implement the method and structures within the hardware component.

[0114] The systems, devices, modules, or units described in the above embodiments may be implemented by computer chips or entities, or by products having certain functions. A typical implementation device is a computer. Specifically, the computer may be, for example, a personal computer, a laptop computer, a cellular phone, a camera phone, a smartphone, a personal digital assistant, a media player, a navigation device, an email device, a game console, a tablet computer, a wearable device, or a combination of any of these devices.

[0115] For the convenience of description, the above devices are described as being divided into various units according to their functions. Of course, when implementing this specification, the functions of each unit can be implemented in the same or multiple software and / or hardware.

[0116] Those skilled in the art will appreciate that the embodiments of the present application can be provided as methods, systems, or computer program products. Therefore, the present application can adopt the form of a complete hardware embodiment, a complete software embodiment, or an embodiment in combination with software and hardware. Moreover, the present application can adopt the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to magnetic disk storage, CD-ROM, optical storage, etc.) that contain computer-usable program code.

[0117] The present application is described with reference to the flowcharts and / or block diagrams of the methods, devices (systems), and computer program products according to the embodiments of the present application. It should be understood that each process and / or box in the flowchart and / or block diagram, as well as the combination of the processes and / or boxes in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing device to produce a machine, so that the instructions executed by the processor of the computer or other programmable data processing device generate instructions for implementing the steps in the process. Figure 1 a process or multiple processes and / or boxes Figure 1 A device that provides the functions specified in a block or multiple blocks.

[0118] These computer program instructions may also be stored in a computer readable memory that can direct a computer or other programmable data processing device to work in a specific manner, so that the instructions stored in the computer readable memory produce an article of manufacture comprising an instruction device, which implements the process Figure 1 a process or multiple processes and / or boxes Figure 1 The function specified in one or more boxes.

[0119] These computer program instructions can also be loaded onto a computer or other programmable data processing device so that a series of operational steps are executed on the computer or other programmable device to produce a computer-implemented process, thereby providing the instructions executed on the computer or other programmable device for implementing the process. Figure 1 a process or multiple processes and / or boxes Figure 1 A step that specifies a function in one or more boxes.

[0120] In a typical configuration, a computing device includes one or more processors (CPUs), input / output interfaces, network interfaces, and memory.

[0121] Memory may include non-permanent storage in a computer-readable medium, random access memory (RAM) and / or non-volatile memory in the form of read-only memory (ROM) or flash RAM. Memory is an example of a computer-readable medium.

[0122] Computer-readable media includes permanent and non-permanent, removable and non-removable media that can be implemented by any method or technology to store information. The information can be computer-readable instructions, data structures, program modules or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technology, compact disc read-only memory (CD-ROM), digital versatile disc (DVD) or other optical storage, magnetic cassettes, magnetic tape, magnetic disk storage or other magnetic storage devices or any other non-transmission media that can be used to store information that can be accessed by a computing device. As defined herein, computer-readable media does not include transitory computer-readable media (transitory media), such as modulated data signals and carrier waves.

[0123] It should also be noted that the terms "comprises," "includes," or any other variations thereof are intended to encompass non-exclusive inclusion, such that a process, method, commodity, or apparatus that includes a list of elements includes not only those elements but also other elements not explicitly listed, or includes elements inherent to such process, method, commodity, or apparatus. In the absence of further limitations, an element defined by the phrase "comprising a..." does not preclude the presence of other identical elements in the process, method, commodity, or apparatus that includes the element.

[0124] Those skilled in the art will appreciate that the embodiments of this specification may be provided as methods, systems, or computer program products. Thus, this specification may take the form of an entirely hardware embodiment, an entirely software embodiment, or an embodiment combining software and hardware. Furthermore, this specification may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to magnetic disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0125] This specification may be described in the general context of computer-executable instructions, such as program modules, executed by a computer. Generally, program modules include routines, programs, objects, components, data structures, and the like that perform specific tasks or implement specific abstract data types. This specification may also be practiced in distributed computing environments where tasks are performed by remote processing devices connected through a communications network. In a distributed computing environment, program modules may be located in both local and remote computer storage media, including storage devices.

[0126] The various embodiments in this specification are described in a progressive manner. Similar parts between the various embodiments can be referred to in conjunction with each other. Each embodiment focuses on the differences between the other embodiments. In particular, the system embodiments are generally similar to the method embodiments, so the description is relatively simple. For relevant parts, refer to the description of the method embodiments.

[0127] The foregoing is merely an embodiment of the present invention and is not intended to limit the present invention. Various modifications and variations are possible for those skilled in the art. Any modifications, equivalent substitutions, improvements, etc. made within the spirit and principles of the present invention are intended to be included within the scope of the claims of this application. < / template> < / template> < / template>

Claims

1. A method for generating a Web component, characterized in that: The method comprises: Obtaining an original component library and a framework of the original component library; Determining a component conversion method corresponding to the framework of the original component library and each functional component included in the original component library, wherein the component conversion method is used to convert the original component into a Web component; For each functional component, determine the common components that support the functional component according to the framework of the original component library; By means of the component conversion method, the functional components are converted into functional elements, and the common components are converted into slot elements; Determining the correspondence between the functional elements and the slot elements according to the correspondence between the functional components and the common components in the framework of the original component library; For each functional element, according to the correspondence between the functional element and the slot elements, the functional element is assembled with the slot elements corresponding to the functional element to obtain a target component.

2. The method according to claim 1, wherein Assembling the functional element with the slot elements corresponding to the functional element according to the corresponding relationship between the functional element and the slot elements specifically includes: Combining the slot elements with the preset templates in the component conversion method to obtain a universal element, and establishing a corresponding relationship between the universal element and the slot elements; According to the correspondence between the functional element and each slot element, and the correspondence between the universal element and each slot element, the correspondence between the functional element and the universal element is determined by using the slot elements common to the two correspondences; According to the corresponding relationship between the functional element and the universal element, the functional element is assembled with the universal element corresponding to the functional element.

3. The method according to claim 1, wherein The component conversion method converts the functional component into a functional element, and converts each common component into a slot element, specifically including: Converting each functional component into a functional element by using the functional component conversion method in the component conversion method; The common component groups are converted into slot elements through the common component conversion method in the component conversion method.

4. The method according to claim 1, wherein The component conversion method converts the common components into slot elements, specifically including: Determining dependencies of the functional component; The common component including the path for calling each dependency is converted into a slot element by the component conversion method.

5. The method according to claim 1, wherein Determine the functional components contained in the original component library, specifically including: Determining classification conditions for each functional component in the original component; Classify each original component according to each classification condition, and determine the functional components in the original component library; Other original components other than the functional components in the original component library are determined as public components.

6. The method according to claim 1, wherein After determining the component conversion method corresponding to the framework of the original component library and the functional components included in the original component library, the method further includes: In response to the update instruction of the original component, determining a newly added functional component as a newly added component; Determine the component conversion method corresponding to the newly added component; Determining the corresponding relationship between the newly added component and each common component according to the framework of the original component library; Convert the newly added component into a newly added element using the component conversion method corresponding to the newly added component; Determining the correspondence between the newly added element and each slot element according to the correspondence between the newly added component and each common component in the framework of the original component library; According to the correspondence between the newly added element and the elements in each slot, the newly added element is assembled with the elements in each slot corresponding to the newly added element to obtain a target component.

7. The method according to claim 1, wherein After determining the component conversion method corresponding to the framework of the original component library and the functional components included in the original component library, the method further includes: In response to the update instruction of the original component, determining a newly added common component as the newly added common component; Determine the component conversion method corresponding to the newly added common component and the framework for updating the original component library; Convert each newly added public component into a newly added slot element using the component conversion method corresponding to the newly added public component; Determining the correspondence between the functional components and the common components including the newly added common components, and determining the correspondence between the functional elements and the slot elements including the newly added slot elements, based on the updated framework of the original component library; According to the correspondence between the functional element and each slot element, the functional element is assembled with each slot element corresponding to the functional element to obtain a target component.

8. A device for generating a web component, characterized in that: The device comprises: A determination module is provided to obtain an original component library and a framework of the original component library, determine a component conversion method corresponding to the framework of the original component library, and various functional components included in the original component library, wherein the component conversion method is used to convert the original component into a Web component; Select a module and, for each functional component, determine the common components that support the functional component according to the framework of the original component library; A conversion module, which converts the functional components into functional elements and converts the common components into slot elements through the component conversion method; A corresponding module determines the corresponding relationship between the functional elements and the slot elements according to the corresponding relationship between the functional components and the common components in the framework of the original component library; The encapsulation module assembles each functional element with the slot elements corresponding to the functional element according to the corresponding relationship between the functional element and the slot elements to obtain a target component.

9. A computer-readable storage medium, characterized in that The storage medium stores a computer program, and when the computer program is executed by a processor, the method according to any one of claims 1 to 7 is implemented.

10. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein: When the processor executes the program, the method according to any one of claims 1 to 7 is implemented.

Images