Component online development and loading method, device, electronic device and storage medium

Abstract

The present invention discloses a component online development and loading method, device, electronic device and storage medium. The method comprises: determining component information corresponding to a target component, and determining a component code corresponding to the target component according to the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a function keyword combination, and the component code comprises a dependent code and a code to be converted; executing the dependent code and obtaining a dependent execution result, determining a first global variable, adding the dependent execution result to the first global variable, and obtaining a target global variable; converting the code to be converted according to the function keyword combination to obtain a target conversion code; determining a target execution code based on the target global variable and the target conversion code, executing the target execution code, and obtaining a loaded target component. The present application can realize online loading of a target component corresponding to a component code developed online according to user needs, and improve the efficiency of online loading of components.

Description

Technical Field

[0001] The present invention relates to the field of computer application technology, and in particular to a component online development and loading method, device, electronic equipment and storage medium. Background Art

[0002] At present, the visualization large-screen platform includes many visualization components. With the expansion of on-site applications of visualization components, there is usually a need for on-site online adjustment of component functions.

[0003] In the related art, the code of the entire platform is usually obtained first, and then the code of the component is developed, that is, the function is adjusted. After the component function is adjusted, the version of the entire platform where the component is located needs to be updated again. Therefore, the complexity of on-site online operations is high, the component loading time is long, and the efficiency is poor. Therefore, there is currently a lack of an efficient component online development and loading method. Summary of the invention

[0004] The present invention provides a component online development and loading method, device, electronic equipment and storage medium to solve the current lack of a high-efficiency component online development and loading method.

[0005] According to one aspect of the present invention, a method for online development and loading of a component is provided, wherein the method comprises:

[0006] In response to a load operation corresponding to a target component, component information corresponding to the target component is determined, and a component code corresponding to the target component is determined according to the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a functional keyword combination, and the component code includes a dependent code and a code to be converted, and the dependent code defines a third-party package on which the target component depends;

[0007] Execute the dependent code and obtain a dependent execution result, determine a first global variable, add the dependent execution result to the first global variable, and obtain a target global variable;

[0008] Determine a function keyword combination in the code to be converted, convert the code to be converted according to the function keyword combination, and obtain a target converted code;

[0009] A target execution code is determined based on the target global variable and the target conversion code, and the target execution code is executed to obtain the loaded target component.

[0010] According to another aspect of the present invention, there is provided an online development and loading device for a component, wherein the device comprises:

[0011] A code acquisition module, configured to determine, in response to a loading operation corresponding to a target component, component information corresponding to the target component, and determine a component code corresponding to the target component according to the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a functional keyword combination, and the component code includes a dependent code and a code to be converted, wherein the dependent code defines a third-party package on which the target component depends;

[0012] A dependency processing module, used for executing the dependency code and obtaining a dependency execution result, determining a first global variable, adding the dependency execution result to the first global variable, and obtaining a target global variable;

[0013] A code conversion module, used for determining a function keyword combination in the code to be converted, converting the code to be converted according to the function keyword combination to obtain a target conversion code;

[0014] The code execution module is used to determine the target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component.

[0015] According to another aspect of the present invention, there is provided an electronic device, the electronic device comprising:

[0016] at least one processor; and

[0017] a memory communicatively connected to the at least one processor; wherein,

[0018] The memory stores a computer program executable by the at least one processor, and the computer program is executed by the at least one processor so that the at least one processor can execute the online development and loading method of the component described in any embodiment of the present invention.

[0019] According to another aspect of the present invention, a computer-readable storage medium is provided, wherein the computer-readable storage medium stores computer instructions, and the computer instructions are used to implement the online development and loading method of the component described in any embodiment of the present invention when executed by a processor.

[0020] The technical solution of the embodiment of the present invention determines the component information corresponding to the target component in response to the loading operation corresponding to the target component, and determines the component code corresponding to the target component according to the component information, wherein the component code is a code developed based on the specification reference and export package corresponding to the function keyword combination, and the component code includes dependent code and code to be converted, and the dependent code defines the third-party package that the target component depends on; execute the dependent code and obtain the dependent execution result, determine the first global variable, add the dependent execution result to the first global variable, and obtain the target global variable; determine the function keyword combination in the code to be converted, convert the code to be converted according to the function keyword combination, and obtain the target conversion code; determine the target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component. Based on the technical solution of the embodiment of the present invention, it is possible to realize the online loading of the target component corresponding to the component code developed online according to user needs, and improve the efficiency of component online loading.

[0021] It should be understood that the contents described in this section are not intended to identify the key or important features of the embodiments of the present invention, nor are they intended to limit the scope of the present invention. Other features of the present invention will become easily understood through the following description. BRIEF DESCRIPTION OF THE DRAWINGS

[0022] In order to more clearly illustrate the technical solutions in the embodiments of the present invention, the following briefly introduces the drawings required for use in the description of the embodiments. Obviously, the drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.

[0023] Figure 1 is a flow chart of a component online development and loading method provided according to Embodiment 1 of the present invention;

[0024] Figure 2 is a flow chart of a component online development and loading method provided according to Embodiment 2 of the present invention;

[0025] Figure 3 is a flow chart of a component online development and loading method provided according to Embodiment 3 of the present invention;

[0026] Figure 4 is a structural diagram of an online development and loading device for a component provided according to a fourth embodiment of the present invention;

[0027] Figure 5 It is a structural schematic diagram of an electronic device for implementing the online development and loading method of components of an embodiment of the present invention. DETAILED DESCRIPTION

[0028] In order to enable those skilled in the art to better understand the scheme of the present invention, the technical scheme in the embodiments of the present invention will be clearly and completely described below in conjunction with the drawings in the embodiments of the present invention. Obviously, the described embodiments are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work should fall within the scope of protection of the present invention.

[0029] It should be noted that the terms "first", "second", etc. in the specification and claims of the present invention and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchanged where appropriate, so that the embodiments of the present invention described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having" and any variations thereof are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device that includes a series of steps or units is not necessarily limited to those steps or units that are clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.

[0030] Embodiment 1

[0031] Figure 1 A flowchart of a component online development and loading method is provided for the first embodiment of the present invention. This embodiment is applicable to the case where component functions are adjusted online based on user needs. The method can be executed by a component online development and loading device. The component online development and loading device can be implemented in the form of hardware and / or software. The component online development and loading device can be configured in a computer. Figure 1 As shown, the method includes:

[0032] S110. In response to a loading operation corresponding to a target component, component information corresponding to the target component is determined, and a component code corresponding to the target component is determined based on the component information, wherein the component code is a code developed based on specification references and export packages corresponding to a functional keyword combination, and the component code includes dependent code and code to be converted, and the dependent code defines a third-party package on which the target component depends.

[0033] The target component may be understood as a target loading component. The target component is the object of the loading operation. In an embodiment of the present invention, the target component may be preset according to scene requirements and is not specifically limited here. Optionally, the target component may include web front-end components such as icons, maps, tables, and decorations with three-dimensional (3D) rendering effects.

[0034] The loading operation can be understood as an operation of loading the target component. In the embodiment of the present invention, the loading operation can be preset according to the scene requirements and is not specifically limited here. Optionally, the loading operation can be a trigger operation for a display mark corresponding to the target component, wherein the trigger operation can include a single-click operation or a double-click operation.

[0035] The component information can be understood as the attribute information of the target component. In an embodiment of the present invention, the component information can be preset according to the scenario requirements and is not specifically limited here. Optionally, the component information may include a component identifier and a component version. Among them, the component identifier can be understood as a unique identifier that characterizes the target component. The component version can be understood as the version of the target component.

[0036] The component code can be understood as the code corresponding to the target component. In an embodiment of the present invention, the component code includes a dependent code and a code to be converted. Optionally, the code to be converted may include a public data structure code, a non-public data structure code, a component configuration code, and a renderer code. In other words, the component code corresponding to the target component may include five parts of code: a dependent code, a public data structure code, a non-public data structure code, a component configuration code, and a renderer code.

[0037] Among them, the public data structure code defines the code definition common to the target component, which is used for unified updating of the code definition. The dependent code defines the third-party package that the target component depends on, wherein the third-party package is loaded through the AMD specification. The default configuration parameters of the target component are defined in the non-public data structure code. The parameter panel configuration of the target component is defined in the component configuration code. The rendering code of the target component is defined in the renderer code, and the renderer code can reference other partial codes (at least one of the dependent code, the public data structure code, the non-public data structure code and the component configuration code), and the renderer code is equivalent to the entry file.

[0038] The functional keyword combination can be understood as a combination of keywords related to the function of the target component. In an embodiment of the present invention, the functional keyword combination includes at least two keywords. Optionally, the functional keyword combination can include an import functional keyword and an export functional keyword.

[0039] The dependency code may be understood as the code that defines the third-party package that the target component depends on.

[0040] The code to be converted can be understood as a code to be converted. Optionally, the code to be converted can be a code to be converted based on the functional keyword combination. In an embodiment of the present invention, the code to be converted can be a code that cannot be directly recognized by the platform browser. The purpose of converting the code to be converted can be to convert the code to be converted into a target conversion code that can be recognized by the platform browser.

[0041] The third-party package may be understood as a package including component functions that have been developed.

[0042] S120, executing the dependent code and obtaining a dependent execution result, determining a first global variable, adding the dependent execution result to the first global variable, and obtaining a target global variable.

[0043] The dependency execution result may be understood as the execution result of the dependency code. Optionally, the dependency execution result may include variables and / or objects. Exemplarily, the dependency execution result may be a react variable.

[0044] The first global variable can be understood as a global variable that can be run by a platform browser. Exemplarily, the first global variable can be modules.

[0045] The target global variable can be understood as a global variable obtained by adding the dependency execution result to the first global variable. In the case where the dependency execution result is react and the first global variable is modules,

[0046] The target global variable may be window.Modules['react'].

[0047] S130: Determine a function keyword combination in the code to be converted, and convert the code to be converted according to the function keyword combination to obtain a target converted code.

[0048] In an embodiment of the present invention, the component code is a code developed based on the specification reference and export package corresponding to the function keyword combination. Therefore, the component code includes the function keyword combination. Optionally, the function keyword combination includes an import function keyword and / or an export function keyword.

[0049] The import function keyword may be understood as a keyword having an import function. Exemplarily, the import function keyword may be import.

[0050] The export function keyword can be understood as a keyword with an import function. Exemplarily, the export function keyword can be export.

[0051] The target conversion code can be understood as a code obtained by converting the code to be converted based on the functional keyword combination. In an embodiment of the present invention, the target conversion code is a code that can be recognized by the platform browser.

[0052] S140: Determine a target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component.

[0053] The target execution code may be understood as the code executed in the group. In the embodiment of the present invention, the target execution code includes all functions in the component code.

[0054] Optionally, executing the target execution code to obtain the loaded target component includes:

[0055] Execute the target execution code to obtain a code execution result;

[0056] A third global variable is determined, the code execution result is saved through the third global variable, and the third global variable that has saved the code execution result is called to obtain the target component that has been loaded.

[0057] The code execution result may be understood as the execution result of the target execution code.

[0058] The third global variable can be understood as a global variable that can be run by a platform browser. Exemplarily, the third global variable can be modules.

[0059] In the embodiment of the present invention, after the target component is loaded, the method further includes: rendering and displaying the target component.

[0060] The technical solution of the embodiment of the present invention determines the component information corresponding to the target component in response to the loading operation corresponding to the target component, and determines the component code corresponding to the target component according to the component information, wherein the component code is a code developed based on the specification reference and export package corresponding to the function keyword combination, and the component code includes dependent code and code to be converted, and the dependent code defines the third-party package that the target component depends on; execute the dependent code and obtain the dependent execution result, determine the first global variable, add the dependent execution result to the first global variable, and obtain the target global variable; determine the function keyword combination in the code to be converted, convert the code to be converted according to the function keyword combination, and obtain the target conversion code; determine the target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component. Based on the technical solution of the embodiment of the present invention, it is possible to realize the online loading of the target component corresponding to the component code developed online according to user needs, and improve the efficiency of component online loading.

[0061] Embodiment 2

[0062] Figure 2 This is a flowchart of a component online development and loading method provided in the second embodiment of the present invention. This embodiment is to convert the code to be converted according to the functional keyword combination in the above embodiment to obtain a target conversion code for refinement. Figure 2 As shown, the method includes:

[0063] S210. In response to a loading operation corresponding to a target component, component information corresponding to the target component is determined, and a component code corresponding to the target component is determined based on the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a functional keyword combination, and the component code includes dependent code and code to be converted.

[0064] S220, executing the dependent code and obtaining a dependent execution result, determining a first global variable, adding the dependent execution result to the first global variable, and obtaining a target global variable.

[0065] S230: Determine a function keyword combination in the code to be converted.

[0066] Optionally, the function keyword combination includes an import function keyword and / or an export function keyword. Exemplarily, the import function keyword may be import. The export function keyword may be export.

[0067] S240. For the code to be converted, convert the import function keyword into a definition variable keyword, and convert the import position keyword corresponding to the import function keyword into a second global variable.

[0068] The variable definition keyword may be understood as a variable definition keyword. In an embodiment of the present invention, the variable definition keyword may be a keyword recognizable by a platform browser. Exemplarily, the variable definition keyword may be const.

[0069] The import position keyword can be understood as a keyword that characterizes the import position and is associated with the import function keyword. In the case where the import function keyword is import, the import position keyword can be from.

[0070] The second global variable can be understood as a global variable that can be run by a platform browser. The first global variable and the second global variable can be global variables of the same type. Exemplarily, the second global variable can be modules.

[0071] Specifically, in the case of import existing in the component code, the import function keyword import is converted into a definition variable keyword const that can be executed by the platform browser; and the import location keyword from is converted into the second global variable modules.

[0072] S250: Determine the export command corresponding to the export function keyword, and convert the export command into an export expression loadable by the platform browser.

[0073] The export command may be understood as an export command associated with the export function keyword. Optionally, the export command includes at least one of a variable declaration, a function declaration, and an export command corresponding to a default keyword.

[0074] Exemplarily, when the export function keyword is export, the export command corresponding to the declared variable may be export(const|var|let), the export command corresponding to the declared function may be exportfunction xxx, and the export command corresponding to the default keyword may be export default.

[0075] The export expression can be understood as an expression executable by a platform browser.

[0076] Specifically, converting the export command into the export expression may include the following situations:

[0077] Convert export(const|var|let) to export.

[0078] Convert export function xxx to export.xxx = function xxx(){};

[0079] Convert export default to export.default=.

[0080] S260: Determine the target conversion code according to the definition variable keyword, the second global variable, and the export expression.

[0081] Specifically, the target conversion code corresponding to the code to be converted is obtained according to the definition variable keyword, the second global variable and the export expression.

[0082] S270: Determine a target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component.

[0083] The technical solution of the embodiment of the present invention converts the import function keyword into a definition variable keyword for the code to be converted, and converts the import position keyword corresponding to the import function keyword into a second global variable; determines the export command corresponding to the export function keyword, and converts the export command into an export expression loadable by a platform browser; and determines the target conversion code according to the definition variable keyword, the second global variable, and the export expression. This achieves the effect of converting the component code developed based on the specification reference and export package corresponding to the function keyword combination into a target conversion code loadable by a platform browser.

[0084] Embodiment 3

[0085] Figure 3 This is a flowchart of a component online development and loading method provided by the third embodiment of the present invention. This embodiment is directed to the above embodiment, in which the response to the loading operation corresponding to the target component is added. Figure 3 As shown, the method includes:

[0086] S310: Determine an original component in a target platform, and obtain an original code corresponding to the original component online in a component development function of the target platform.

[0087] The target platform may be understood as a platform for loading the target component.

[0088] The original component can be understood as a component of a historical version corresponding to the target component. The original code can be understood as a code corresponding to the original component.

[0089] The component development function can be understood as a tool defined in the target platform that can obtain the code corresponding to the component. Based on the component development function, it can be independent of the underlying code of the target platform, directly and only obtain the original code corresponding to the original component, and realize the in-progress development of the original code.

[0090] S320: In response to an online development operation on the original code, determine the component code.

[0091] The online development operation may be understood as an operation of developing the original code online. In an embodiment of the present invention, the online development operation may be an operation of adjusting the original code.

[0092] The component code can be understood as the code obtained after the original code is developed online.

[0093] S330: Determine the component information corresponding to the component code, associate the component information and the component code, and store them in a database, wherein the component information includes a component identifier and / or a component version.

[0094] The database may be understood as a database storing the component codes.

[0095] The component information can be understood as the attribute information of the target component corresponding to the component code. In an embodiment of the present invention, the component information can be preset according to the scenario requirements and is not specifically limited here. Optionally, the component information may include a component identifier and a component version. Among them, the component identifier can be understood as a unique identifier that characterizes the target component. The component version can be understood as the version of the target component.

[0096] The associating the component information and the component code may include: associating the component identifier, the component version and the component code.

[0097] Optionally, determining the component code corresponding to the target component according to the component information includes:

[0098] The component code corresponding to the component identifier and the component version is obtained from the database through a backend interface.

[0099] Specifically, in response to a loading operation corresponding to a target component, the component identifier and the component version corresponding to the target component are determined, and the component code associated with the component identifier and the component version is acquired from the database through a backend interface.

[0100] S340. In response to a loading operation corresponding to a target component, component information corresponding to the target component is determined, and a component code corresponding to the target component is determined based on the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a functional keyword combination, and the component code includes dependent code and code to be converted.

[0101] S350, executing the dependent code and obtaining a dependent execution result, determining a first global variable, adding the dependent execution result to the first global variable, and obtaining a target global variable.

[0102] S360: Determine a function keyword combination in the code to be converted, and convert the code to be converted according to the function keyword combination to obtain a target converted code.

[0103] S370: Determine a target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component.

[0104] The technical solution of the embodiment of the present invention is to determine the original component in the target platform, and obtain the original code corresponding to the original component online in the component development function of the target platform; determine the component code in response to the online development operation for the original code; determine the component information corresponding to the component code, associate the component information and the component code, and store them in a database, wherein the component information includes a component identifier and / or a component version. The problem that the operation flow of the method for adjusting the function of the traditional component is very complicated is solved, which requires first obtaining the platform code of the platform where the component is located, then determining the component code corresponding to the component based on the platform code, and re-releasing the platform version after developing the component code to realize the component loading method. The present application realizes the direct online acquisition of the component code in the component development function, and develops (adjusts the function) the component code online according to user needs, and stores the developed code in the database, realizes the online development of the component, and can directly realize the online loading of the adjusted component (i.e., the target component) based on the stored component code, without calling the platform code or re-releasing the platform version, and can realize the online development and loading of the component, thereby improving the convenience of online development and loading of the component and the user experience.

[0105] The present invention performs online development (function adjustment) of components based on the component development function defined in the platform, and can perform version management. That is, if the function of the component needs to be updated, it is only necessary to modify the component code based on the component development function defined in the platform to achieve online development and loading of the component, thereby improving the convenience of online development of the component, improving the efficiency of online loading of the component, and improving the user experience.

[0106] The present invention provides an overall process of an online development and loading method of a component. The method comprises:

[0107] Optionally, the target component of the present invention can be a web front-end component. Specifically, when defining a web front-end component, the present invention can split the functions of the component into five parts of code, namely, public data structure, dependency, non-public data structure, component configuration, and renderer, and define them separately, wherein the public data structure defines the code definition common to the target component, which is used to uniformly update the code definition. The dependency code defines the third-party package that the target component depends on, wherein the third-party package is loaded through the amd specification. The non-public data structure code defines the default configuration parameters of the target component. The component configuration code defines the parameter panel configuration of the target component. The renderer code defines the rendering code of the target component, and the renderer code can reference other parts of code (dependency, public data structure, non-public data structure, and at least one of the component configuration codes), and the renderer is equivalent to the entry file; the component code can reference and export packages using the import and export specifications of the JavaScript language standard (ECMAScript 6, es6).

[0108] Specifically, the process of online loading of the target component may be as follows, wherein the execution subject may be the platform front end:

[0109] 1. According to the component identifier (e.g., id) and component version of the target component, obtain the component code defined in the database through the backend interface;

[0110] 2. After obtaining the component code, first load the dependency code of the target component through requirejs, put the dependency execution result corresponding to the loaded dependency code into a global variable (i.e., the first global variable), and obtain the target global variable (for example, window.modules['react'], where modules is the first global variable and the react variable is the dependency execution result);

[0111] 3. Compile the four parts of code (code to be converted): public data structure, non-public data structure, component configuration and renderer:

[0112] If there is import (i.e., the import function keyword) in the code to be converted, convert the import into an executable variable (i.e., define a variable keyword, such as const), and convert the from corresponding to the import into a global variable modules (i.e., the second global variable);

[0113] If there is export (i.e. the export function keyword) in the code to be converted, the conversion is performed based on the following rules:

[0114] Convert export(const|var|let) to export.

[0115] Convert export function xxx to export.xxx = function xxx(){};

[0116] Convert export default to export.default=;

[0117] 4. Execute the converted component code through a code execution function (for example, an eval function), and store the code execution result through a third global variable; call the third global variable that has stored the code execution result, load and render the target component.

[0118] The present invention discloses a method for online development and loading of a web front-end component. The application can define a target component in a component development function of a platform, and develop the target component online, and can perform multi-version management, so that when a user has a requirement to update a component function, the component code can be directly developed (or modified) in the platform, and the adjusted code can be made effective, thereby solving the problem that the traditional method of defining component functions in the platform code domain needs to reissue the entire platform version after the code is modified when the component function needs to be adjusted, which has a high degree of complexity and a poor user experience. The application realizes the online development and loading of components, has good convenience, meets the personalized needs of users, and improves the user experience.

[0119] Embodiment 4

[0120] Figure 4 This is a schematic diagram of the structure of an online development and loading device for a component provided by Embodiment 4 of the present invention. Figure 4 As shown, the device includes: a code acquisition module 410, a dependency processing module 420, a code conversion module 430 and a code execution module 440. Among them,

[0121] A code acquisition module 410 is used to determine the component information corresponding to the target component in response to a loading operation corresponding to the target component, and determine the component code corresponding to the target component based on the component information, wherein the component code is a code developed based on the specification reference and export package corresponding to the functional keyword combination, and the component code includes dependent code and code to be converted, and the dependent code defines the third-party package that the target component depends on; a dependency processing module 420 is used to execute the dependent code and obtain a dependency execution result, determine a first global variable, add the dependency execution result to the first global variable, and obtain a target global variable; a code conversion module 430 is used to determine a functional keyword combination in the code to be converted, convert the code to be converted according to the functional keyword combination, and obtain a target conversion code; a code execution module 440 is used to determine a target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component.

[0122] The technical solution of the embodiment of the present invention determines the component information corresponding to the target component in response to the loading operation corresponding to the target component, and determines the component code corresponding to the target component according to the component information, wherein the component code is a code developed based on the specification reference and export package corresponding to the function keyword combination, and the component code includes dependent code and code to be converted, and the dependent code defines the third-party package that the target component depends on; execute the dependent code and obtain the dependent execution result, determine the first global variable, add the dependent execution result to the first global variable, and obtain the target global variable; determine the function keyword combination in the code to be converted, convert the code to be converted according to the function keyword combination, and obtain the target conversion code; determine the target execution code based on the target global variable and the target conversion code, execute the target execution code, and obtain the loaded target component. Based on the technical solution of the embodiment of the present invention, it is possible to realize the online loading of the target component corresponding to the component code developed online according to user needs, and improve the efficiency of component online loading.

[0123] Optionally, the code to be converted includes public data structure code, non-public data structure code, component configuration code and renderer code.

[0124] Optionally, the function keyword combination includes an import function keyword and / or an export function keyword; the code conversion module 430 includes: an import conversion unit, an export conversion unit and a conversion combination unit; wherein,

[0125] The import conversion unit is used to convert the import function keyword into a definition variable keyword for the code to be converted, and convert the import position keyword corresponding to the import function keyword into a second global variable;

[0126] The export conversion unit is used to determine the export command corresponding to the export function keyword, and convert the export command into an export expression loadable by the platform browser;

[0127] The conversion combination unit is used to determine the target conversion code according to the definition variable keyword, the second global variable and the export expression.

[0128] Optionally, the export command includes at least one of an export command corresponding to a variable declaration, a function declaration, and a default keyword.

[0129] Optionally, the online development and loading device of the component further includes: an original code acquisition module, an online development module and a code storage module; wherein,

[0130] The original code acquisition module is used to determine the original component in the target platform before responding to the loading operation corresponding to the target component, and to obtain the original code corresponding to the original component online in the component development function of the target platform;

[0131] The online development module is used to determine the component code in response to an online development operation on the original code;

[0132] The code storage module is used to determine the component information corresponding to the component code, associate the component information and the component code, and store them in a database, wherein the component information includes a component identifier and / or a component version.

[0133] Optionally, the code acquisition module 410 is used to:

[0134] The component code corresponding to the component identifier and the component version is obtained from the database through a backend interface.

[0135] Optionally, the code execution module 440 is used to:

[0136] Execute the target execution code to obtain a code execution result;

[0137] A third global variable is determined, the code execution result is saved through the third global variable, and the third global variable that has saved the code execution result is called to obtain the target component that has been loaded.

[0138] The online development and loading device of components provided in the embodiment of the present invention can execute the online development and loading method of components provided in any embodiment of the present invention, and has the corresponding functional modules and beneficial effects of the execution method.

[0139] Embodiment 5

[0140] Figure 5 A schematic diagram of the structure of an electronic device 10 that can be used to implement an embodiment of the present invention is shown. The electronic device is intended to represent various forms of digital computers, such as laptop computers, desktop computers, workstations, personal digital assistants, servers, blade servers, mainframe computers, and other suitable computers. The electronic device can also represent various forms of mobile devices, such as personal digital processing, cellular phones, smart phones, wearable devices (such as helmets, glasses, watches, etc.) and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely examples and are not intended to limit the implementation of the present invention described and / or required herein.

[0141] like Figure 5 As shown, the electronic device 10 includes at least one processor 11, and a memory connected to the at least one processor 11, such as a read-only memory (ROM) 12, a random access memory (RAM) 13, etc., wherein the memory stores a computer program that can be executed by at least one processor, and the processor 11 can perform various appropriate actions and processes according to the computer program stored in the read-only memory (ROM) 12 or the computer program loaded from the storage unit 18 to the random access memory (RAM) 13. In the RAM 13, various programs and data required for the operation of the electronic device 10 can also be stored. The processor 11, the ROM 12, and the RAM 13 are connected to each other through a bus 14. An input / output (I / O) interface 15 is also connected to the bus 14.

[0142] A number of components in the electronic device 10 are connected to the I / O interface 15, including: an input unit 16, such as a keyboard, a mouse, etc.; an output unit 17, such as various types of displays, speakers, etc.; a storage unit 18, such as a disk, an optical disk, etc.; and a communication unit 19, such as a network card, a modem, a wireless communication transceiver, etc. The communication unit 19 allows the electronic device 10 to exchange information / data with other devices through a computer network such as the Internet and / or various telecommunication networks.

[0143] The processor 11 may be a variety of general and / or special processing components with processing and computing capabilities. Some examples of the processor 11 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various special artificial intelligence (AI) computing chips, various processors running machine learning model algorithms, a digital signal processor (DSP), and any appropriate processor, controller, microcontroller, etc. The processor 11 executes the various methods and processes described above, such as the online development and loading method of the component.

[0144] In some embodiments, the online development and loading method of the component may be implemented as a computer program, which is tangibly contained in a computer-readable storage medium, such as a storage unit 18. In some embodiments, part or all of the computer program may be loaded and / or installed on the electronic device 10 via the ROM 12 and / or the communication unit 19. When the computer program is loaded into the RAM 13 and executed by the processor 11, one or more steps of the online development and loading method of the component described above may be performed. Alternatively, in other embodiments, the processor 11 may be configured to execute the online development and loading method of the component by any other appropriate means (e.g., by means of firmware).

[0145] Various implementations of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chips (SOCs), load programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various implementations can include: being implemented in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which can be a special purpose or general purpose programmable processor that can receive data and instructions from a storage system, at least one input device, and at least one output device, and transmit data and instructions to the storage system, the at least one input device, and the at least one output device.

[0146] Computer programs for implementing the methods of the present invention may be written in any combination of one or more programming languages. These computer programs may be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing device, so that when the computer program is executed by the processor, the functions / operations specified in the flow chart and / or block diagram are implemented. The computer program may be executed entirely on the machine, partially on the machine, partially on the machine and partially on a remote machine as a stand-alone software package, or entirely on a remote machine or server.

[0147] In the context of the present invention, a computer-readable storage medium may be a tangible medium that may contain or store a computer program for use by or in combination with an instruction execution system, device or equipment. A computer-readable storage medium may include, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, devices or equipment, or any suitable combination of the foregoing. Alternatively, a computer-readable storage medium may be a machine-readable signal medium. A more specific example of a machine-readable storage medium may include an electrical connection based on one or more lines, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

[0148] To provide interaction with a user, the systems and techniques described herein may be implemented on an electronic device having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to the user; and a keyboard and a pointing device (e.g., a mouse or trackball) through which the user can provide input to the electronic device. Other types of devices may also be used to provide interaction with the user; for example, the feedback provided to the user may be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user may be received in any form (including acoustic input, voice input, or tactile input).

[0149] The systems and techniques described herein may be implemented in a computing system that includes backend components (e.g., as a data server), or a computing system that includes middleware components (e.g., an application server), or a computing system that includes frontend components (e.g., a user computer with a graphical user interface or a web browser through which a user can interact with implementations of the systems and techniques described herein), or a computing system that includes any combination of such backend components, middleware components, or frontend components. The components of the system may be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: a local area network (LAN), a wide area network (WAN), a blockchain network, and the Internet.

[0150] A computing system may include a client and a server. The client and the server are generally remote from each other and usually interact through a communication network. The client and server relationship is generated by computer programs running on the corresponding computers and having a client-server relationship with each other. The server may be a cloud server, also known as a cloud computing server or cloud host, which is a host product in the cloud computing service system to solve the defects of difficult management and weak business scalability in traditional physical hosts and VPS services.

[0151] It should be understood that the various forms of processes shown above can be used to reorder, add or delete steps. For example, the steps described in the present invention can be executed in parallel, sequentially or in different orders, as long as the desired results of the technical solution of the present invention can be achieved, and this document does not limit this.

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

Claims

1. A component online development and loading method, characterized in that: include: In response to a load operation corresponding to a target component, component information corresponding to the target component is determined, and a component code corresponding to the target component is determined according to the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a functional keyword combination, and the component code includes a dependent code and a code to be converted, and the dependent code defines a third-party package on which the target component depends; Execute the dependent code and obtain a dependent execution result, determine a first global variable, add the dependent execution result to the first global variable, and obtain a target global variable; Determine a function keyword combination in the code to be converted; wherein the function keyword combination is a combination of keywords related to the function of the target component; the function keyword combination includes an import function keyword and / or an export function keyword; For the code to be converted, convert the import function keyword into a definition variable keyword, and convert the import position keyword corresponding to the import function keyword into a second global variable; Determine an export command corresponding to the export function keyword, and convert the export command into an export expression loadable by a platform browser; Determine a target conversion code according to the definition variable keyword, the second global variable and the derived expression; Determine a target execution code based on the target global variable and the target conversion code; Execute the target execution code to obtain a code execution result; Determine a third global variable, save the code execution result through the third global variable, call the third global variable that has saved the code execution result, and obtain the loaded target component; Among them, the variable definition keyword is a keyword that can be recognized by the platform browser; the first global variable, the second global variable and the third global variable are global variables that can be executed by the platform browser; and the export expression is an expression that can be executed by the platform browser.

2. The method according to claim 1, characterized in that The code to be converted includes public data structure code, non-public data structure code, component configuration code and renderer code.

3. The method according to claim 1, characterized in that The export command includes at least one of a variable declaration, a function declaration, and an export command corresponding to a default keyword.

4. The method according to claim 1, characterized in that: Before the response to the loading operation corresponding to the target component, the method further includes: Determine the original component in the target platform, and obtain the original code corresponding to the original component online in the component development function of the target platform; In response to an online development operation on the original version code, determining the component code; The component information corresponding to the component code is determined, the component information and the component code are associated, and stored in a database, wherein the component information includes a component identifier and / or a component version.

5. The method according to claim 4, characterized in that The determining the component code corresponding to the target component according to the component information includes: The component code corresponding to the component identifier and the component version is obtained from the database through a backend interface.

6. An online development and loading device for components, characterized in that: include: A code acquisition module, configured to determine, in response to a loading operation corresponding to a target component, component information corresponding to the target component, and determine a component code corresponding to the target component according to the component information, wherein the component code is a code developed based on a specification reference and an export package corresponding to a functional keyword combination, and the component code includes a dependent code and a code to be converted, wherein the dependent code defines a third-party package on which the target component depends; A dependency processing module, used for executing the dependency code and obtaining a dependency execution result, determining a first global variable, adding the dependency execution result to the first global variable, and obtaining a target global variable; A code conversion module, used for determining a function keyword combination in the code to be converted; wherein the function keyword combination is a combination of keywords related to the function of the target component; the function keyword combination includes an import function keyword and / or an export function keyword; for the code to be converted, converting the import function keyword into a definition variable keyword, and converting the import position keyword corresponding to the import function keyword into a second global variable; determining an export command corresponding to the export function keyword, and converting the export command into an export expression loadable by a platform browser; determining a target conversion code according to the definition variable keyword, the second global variable and the export expression; A code execution module is used to determine a target execution code based on the target global variable and the target conversion code; execute the target execution code to obtain a code execution result; determine a third global variable, save the code execution result through the third global variable, call the third global variable that has saved the code execution result, and obtain the loaded target component; Among them, the variable definition keyword is a keyword that can be recognized by the platform browser; the first global variable, the second global variable and the third global variable are global variables that can be executed by the platform browser; and the export expression is an expression that can be executed by the platform browser.

7. An electronic device, characterized in that: The electronic device comprises: at least one processor; and a memory communicatively connected to the at least one processor; wherein, The memory stores a computer program executable by the at least one processor, and the computer program is executed by the at least one processor so that the at least one processor can perform the online development and loading method of a component according to any one of claims 1 to 5.

8. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer instructions, and the computer instructions are used to enable a processor to implement the online development and loading method of a component according to any one of claims 1 to 5 when executed.

Images