Application transformation method, device and equipment based on micro front end and storage medium

Abstract

The invention discloses an application transformation method, device and equipment based on a micro front end, and a storage medium. The method comprises the following steps: modifying a sub-application configuration file in a micro front end sub-application framework according to a sub-application name and a sub-application port in a script starting command; according to a sub-application source code path in the script starting command, obtaining a to-be-migrated service catalogue under an original front-end framework of the webpage application program, and copying the to-be-migrated service catalogue into a micro-front-end sub-application catalogue of a micro-front-end sub-application framework layer by layer; obtaining a routing file in the micro front end sub-application framework, and modifying each routing path in the routing file according to the sub-application name; according to the project dependent file under the original front-end framework, modifying a dependent file to be verified in the micro front-end application framework; and integrating the transformed micro-front-end sub-applications according to the modified sub-application configuration file to obtain a webpage application program after micro-front-end transformation, so that front-end code decoupling can be realized, and the response speed of the application program is improved.

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a micro-front-end based application transformation method, device, equipment and storage medium. Background Art

[0002] At present, the rapid iteration and flexible deployment of industrial control security software are usually supported by integrating the front-end and back-end middle-end systems. Specifically, the front-end business code can be stored in the module directory of the original front-end framework (that is, the modules directory), the basic front-end code used to implement middle-end user management and system management can be stored in the basic folder (that is, the base directory) under the module directory, and the project-related front-end business code can be stored in the resource folder (that is, the soc directory) under the module directory.

[0003] However, when using existing technologies for front-end development, the middle-end front-end basic framework and the front-end business code are highly coupled, resulting in cumbersome development, packaging, and maintenance processes, which reduces the efficiency and flexibility of front-end development. Secondly, due to the mixed packaging of the middle-end front-end basic framework and the front-end business code, any minor business update requires comprehensive regression testing of the entire front-end system, which not only consumes a lot of resources, but also reduces iteration efficiency and increases the risk of errors. Summary of the invention

[0004] The present invention provides an application transformation method, device, equipment and storage medium based on a micro front end, which can decouple the middle platform front end basic framework and the front end business code, and improve the response speed of the web application program.

[0005] In a first aspect, an embodiment of the present invention provides an application transformation method based on a micro front-end, including:

[0006] After receiving the script start command input by the user, modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script start command;

[0007] According to the sub-application source code path in the script startup command, obtain the business directory to be migrated under the original front-end framework of the web application, and copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework;

[0008] Get the routing file in the micro-frontend sub-application framework, and modify each routing path in the routing file according to the sub-application name; the routing path is used to obtain the front-end page of the micro-frontend sub-application, which is a sub-application obtained by performing micro-frontend transformation on the business code to be migrated in the business directory to be migrated;

[0009] Modify the dependency files to be verified in the micro-frontend sub-application framework according to the project dependency files under the original front-end framework;

[0010] The micro-frontend sub-application is obtained after the business directory to be migrated is copied, the routing path is modified, and the dependent files to be verified are modified. The micro-frontend sub-application is integrated according to the modified sub-application configuration file to obtain the web application after the micro-frontend transformation.

[0011] Optionally, each routing path in the routing file is modified according to the sub-application name, including: obtaining a routing path in the routing file as the current routing path in turn, and determining whether the prefix of the current routing path is a first preset prefix; wherein the first preset prefix is ​​used to represent the entry path for accessing the web application before the micro-frontend transformation; if so, after removing the first preset prefix in the current routing path, adding a second preset prefix containing the sub-application name to the current routing path; if not, directly adding the second preset prefix containing the sub-application name to the current routing path.

[0012] Optionally, based on the project dependency files under the original front-end framework, modify the dependency files to be verified in the micro-front-end sub-application framework, including: obtaining the development dependency names and development dependency version numbers for the development environment in the project dependency files; obtaining the dependency names and dependency version numbers to be compared that are pre-configured in the micro-front-end sub-application framework in the dependency files to be verified, and comparing the dependency names to be compared with the development dependency names to determine whether there are missing development dependencies in the micro-front-end sub-application framework; if there are missing development dependencies in the micro-front-end sub-application framework, then in the micro-front-end Install the missing development dependencies under the terminal application framework, and add the version number and name of the missing development dependencies to the dependency file to be verified; compare the version number of the dependency to be compared with the version number of the development dependency to determine whether the version of the dependency to be compared for the development environment needs to be updated; if there are dependencies to be compared for the development environment that need to be updated in the microfrontend subapplication framework, install the dependencies to be compared for the development environment that need to be updated under the microfrontend subapplication framework, and add the updated version number of the dependencies to be compared for the development environment that need to be updated to the dependency file to be verified.

[0013] Optionally, modifying the dependency file to be verified in the micro-frontend sub-application framework according to the project dependency file under the original front-end framework also includes: obtaining the production dependency name and production dependency version number for the production environment in the project dependency file; comparing the dependency name to be compared with the production dependency name to determine whether there are missing production dependencies in the micro-frontend sub-application framework; if there are missing production dependencies in the micro-frontend sub-application framework, installing the missing production dependencies under the micro-frontend sub-application framework, and adding the version number and name of the missing production dependencies to the dependency file to be verified; comparing the dependency version number to be compared with the production dependency version number to determine whether it is necessary to update the version of the dependency to be compared for the production environment; if there are dependencies to be compared for the production environment that need to be updated in the micro-frontend sub-application framework, installing the dependencies to be compared for the production environment that need to be updated under the micro-frontend sub-application framework, and adding the updated version number of the dependencies to be compared for the production environment that need to be updated to the dependency file to be verified.

[0014] Optionally, micro-frontend sub-application integration is performed according to the modified sub-application configuration file to obtain a web application after the micro-frontend transformation, including: after receiving the Uniform Resource Locator (URL) including the sub-application name and the sub-application port entered by the user in the browser, obtaining the sub-application configuration file in the micro-frontend sub-application framework through the front-end base that has completed the micro-frontend transformation, and comparing the sub-application name and sub-application port in the sub-application configuration file with the sub-application name and sub-application port in the Uniform Resource Locator; performing micro-frontend sub-application integration according to the comparison results of the sub-application name and the sub-application port to obtain the web application after the micro-frontend transformation.

[0015] Optionally, the method further includes: after receiving a dependency version locking command input by the user, locking the version numbers of each dependency item to be compared in the modified dependency file to be verified, so as to enhance the stability of compiling the code under the micro front-end sub-application framework.

[0016] Optionally, the method further includes: obtaining a static resource directory under the original front-end framework, and migrating the static resources in the static resource directory to the static resource directory under the micro front-end sub-application framework.

[0017] In a second aspect, an embodiment of the present invention further provides an application transformation device based on a micro front-end, including:

[0018] A configuration file modification module is used to modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script startup command after receiving the script startup command input by the user;

[0019] The directory migration module is used to obtain the business directory to be migrated under the original front-end framework of the web application according to the sub-application source code path in the script startup command, and copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework;

[0020] The routing path modification module is used to obtain the routing file in the micro-frontend sub-application framework and modify each routing path in the routing file according to the sub-application name; wherein the routing path is used to obtain the front-end page of the micro-frontend sub-application, and the micro-frontend sub-application is a sub-application obtained by performing micro-frontend transformation on the business code to be migrated in the business directory to be migrated;

[0021] The dependency file modification module is used to modify the dependency files to be verified in the micro-frontend sub-application framework according to the project dependency files under the original front-end framework;

[0022] The micro-frontend integration module is used to obtain the micro-frontend sub-application after copying the business directory to be migrated, modifying the routing path and modifying the dependent files to be verified, and integrate the micro-frontend sub-application according to the modified sub-application configuration file to obtain the web application after the micro-frontend transformation.

[0023] In a third aspect, an embodiment of the present invention further provides an electronic device, comprising: 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 execute the micro-frontend-based application transformation method provided in any embodiment of the present invention.

[0024] In a fourth aspect, an embodiment of the present invention further provides a computer-readable storage medium, which stores computer instructions, and the computer instructions are used to enable a processor to implement the micro-front-end based application transformation method provided by any embodiment of the present invention when executed.

[0025] The technical solution provided by the embodiment of the present invention generates a micro-frontend sub-application corresponding to the front-end business code based on the micro-frontend sub-application framework, realizes the decoupling of the middle-end front-end basic framework and the front-end business code, and improves the response speed of the web application. Secondly, after the decoupling of the middle-end front-end basic framework and the front-end business code, independent testing of the micro-frontend sub-application can be realized, thereby saving testing resources, improving iteration efficiency, and reducing the risk of errors.

[0026] 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

[0027] 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.

[0028] Figure 1 This is a flowchart of a micro-frontend-based application transformation method provided according to Embodiment 1 of the present invention;

[0029] Figure 2 is a flowchart of another micro-frontend-based application transformation method provided according to Embodiment 2 of the present invention;

[0030] Figure 3 is a structural schematic diagram of an application transformation device based on a micro-frontend provided according to Embodiment 3 of the present invention;

[0031] Figure 4 It is a schematic diagram of the structure of an electronic device provided by Embodiment 4 of the present invention. DETAILED DESCRIPTION

[0032] 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.

[0033] 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.

[0034] Embodiment 1

[0035] Figure 1It is a flowchart of a micro-frontend-based application transformation method provided according to Example 1 of the present invention. This embodiment is applicable to the situation of performing micro-frontend transformation on a web application. The method can be executed by a micro-frontend-based application transformation device. The micro-frontend-based application transformation device can be implemented in the form of hardware and / or software. The micro-frontend-based application transformation device can be configured in an electronic device such as a computer.

[0036] like Figure 1 As shown, a micro-frontend-based application transformation method disclosed in this embodiment includes:

[0037] S110. After receiving the script start command input by the user, modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script start command.

[0038] In this embodiment, the script start command can be used to start the process of micro-frontend transformation of the web application. The web application can be an application developed based on the World Wide Web (Web) technology. The micro-frontend sub-application framework can be a framework that pre-sets the basic structure, configuration files, and dependent files to be verified of the micro-frontend sub-application. The micro-frontend sub-application framework does not include front-end code with actual business logic.

[0039] In this step, specifically, after receiving the script startup command input by the user through the command line tool, the sub-application name and sub-application port in the script startup command can be extracted, and the length of the sub-application name and the range of the sub-application port can be verified. The script startup command can be "npm run format". Then, the verified sub-application name and sub-application port can be written into the sub-application configuration file.

[0040] The above technical solution can improve the accuracy of the sub-application name and sub-application port written into the sub-application configuration file by verifying the length of the sub-application name and the range of the sub-application port, laying the foundation for the subsequent successful integration of the micro front-end sub-application.

[0041] S120. According to the sub-application source code path in the script startup command, obtain the business directory to be migrated in the original front-end framework of the web application, and copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework.

[0042] In this embodiment, there may be multiple types of original front-end frameworks, such as a Vue framework. The business directory to be migrated may be used to store front-end code containing actual business logic. The number of micro-front-end sub-application frameworks may be the same as the number of business directories to be migrated.

[0043] In this step, specifically, after receiving the script start command input by the user, the sub-application source code path in the script start command can be extracted, and the validity of the sub-application source code path can be verified. Then, after the validity check of the sub-application source code path is passed, the directory copy function (i.e., CopyDirectory function) can be used to copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory. Optionally, after the business directory to be migrated is copied layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework, the redundant information stored under the micro-front-end sub-application framework, such as temporary directories and duplicate image resources, can be removed to reduce the storage resources occupied.

[0044] S130: Obtain a routing file in the micro front-end sub-application framework, and modify each routing path in the routing file according to the sub-application name.

[0045] The routing path is used to obtain the front-end page of the micro-front-end sub-application. The micro-front-end sub-application is a sub-application obtained after the micro-front-end transformation is performed on the business code to be migrated in the business directory to be migrated.

[0046] In this step, specifically, the route formatting function (that is, the formatRoutes function) can be used to add a prefix containing the sub-application name to each route path in the route file to improve the efficiency of obtaining the front-end page.

[0047] S140. Modify the dependency files to be verified in the micro front-end sub-application framework according to the project dependency files in the original front-end framework.

[0048] The dependency file may be a file that records the dependency name and dependency version.

[0049] Specifically, the dependency file to be verified may be compared with the project dependency file, and based on the comparison result, the dependency name and / or dependency version recorded in the dependency file to be verified may be modified.

[0050] S150, obtaining the micro-frontend sub-application obtained after copying the business directory to be migrated, modifying the routing path and modifying the dependent files to be verified, and integrating the micro-frontend sub-application according to the modified sub-application configuration file to obtain the web application after the micro-frontend transformation.

[0051] In this step, specifically, when the front-end base and each micro-front-end sub-application that have completed the micro-front-end transformation are running, the front-end base and each micro-front-end sub-application can be integrated according to the sub-application name and sub-application port in the modified sub-application configuration file to obtain the web application after the micro-front-end transformation. Among them, the front-end base belongs to the non-business part and is only used to provide the basic operating functions of the micro-front-end framework, such as dynamic loading of sub-applications and unified routing management.

[0052] It should be noted that the technical solution of this embodiment can perform micro-front-end transformation for each business directory to be migrated under the original front-end framework, and obtain micro-front-end sub-applications corresponding to each business directory to be migrated. Exemplarily, for industrial control security software including industrial control network target range functions and industrial control vulnerability mining functions, the front-end code for implementing the industrial control network target range function and the front-end code for implementing the industrial control vulnerability mining function are stored in different business folders (i.e., different migration business directories), then a micro-front-end sub-application for implementing the industrial control target range front-end business and a micro-front-end sub-application for implementing the industrial control vulnerability mining front-end business can be generated.

[0053] The technical solution of this embodiment is to modify the sub-application configuration file in the pre-built micro-frontend sub-application framework according to the sub-application name and sub-application port in the script startup command after receiving the script startup command input by the user; obtain the business directory to be migrated under the original front-end framework of the web application according to the sub-application source code path in the script startup command, and copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework; obtain the routing file in the micro-front-end sub-application framework, and modify each routing path in the routing file according to the sub-application name; wherein the routing path is used to obtain the front-end page of the micro-front-end sub-application, and the micro-front-end sub-application is for the business directory to be migrated. The sub-application obtained after the business code to be migrated in the business directory is transformed into a micro-frontend; according to the project dependency files under the original front-end framework, the dependency files to be verified in the micro-frontend sub-application framework are modified; the micro-frontend sub-application obtained after the business directory to be migrated is copied, the routing path is modified, and the dependency files to be verified are modified, and the micro-frontend sub-application is integrated according to the modified sub-application configuration file to obtain the technical means of the web application after the micro-frontend transformation, which solves the problem of high coupling between the front-end basic framework and the front-end business code caused by the front-end development through the existing framework, and the front-end basic framework and the front-end business code of the middle platform can be decoupled to improve the response speed of the web application. Secondly, after the decoupling of the front-end basic framework and the front-end business code of the middle platform, the independent testing of the micro-frontend sub-application can be realized, thereby saving testing resources, improving iteration efficiency, and reducing the risk of errors.

[0054] Embodiment 2

[0055] Figure 2 It is a flowchart of another micro-frontend-based application transformation method provided according to Example 2 of the present invention. This embodiment is a further optimization and expansion based on the above embodiments, and can be combined with various optional technical solutions in the above implementation methods.

[0056] like Figure 2 As shown, a micro-frontend-based application transformation method disclosed in this embodiment includes:

[0057] S210. After receiving the script start command input by the user, modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script start command.

[0058] S220. According to the sub-application source code path in the script startup command, obtain the business directory to be migrated in the original front-end framework of the web application, and copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework.

[0059] Optionally, the method further includes: obtaining a static resource directory under the original front-end framework, and migrating the static resources in the static resource directory to the static resource directory under the micro front-end sub-application framework.

[0060] Specifically, after the service directory to be migrated is copied layer by layer to the micro front-end sub-application directory of the micro front-end sub-application framework, the static resources in the static resource directory can be migrated to the static resource directory under the micro front-end sub-application framework.

[0061] S230, sequentially obtain a routing path in the routing file as the current routing path, determine whether the prefix of the current routing path is the first preset prefix, if so, execute S240, if not, execute S250.

[0062] Among them, the first preset prefix is ​​used to represent the entry path for accessing the web application before the micro-frontend transformation.

[0063] Exemplarily, assuming that the first preset prefix is ​​" / index / ", it can be detected whether the current routing path starts with " / index / ".

[0064] S240: After removing the first preset prefix in the current routing path, add a second preset prefix including the sub-application name to the current routing path.

[0065] In this step, specifically, if the current routing path begins with a first preset prefix, after removing the first preset prefix at the beginning of the current routing path, a second preset prefix containing the sub-application name may be added in front of the current routing path.

[0066] Continuing with the previous example, assuming that the second preset prefix is ​​" / ${appname}", you can add " / ${appname}" in front of the current routing path after removing the " / index / " at the beginning of the current routing path.

[0067] S250. Directly add a second preset prefix including the sub-application name to the current routing path.

[0068] In this step, specifically, if the current routing path does not start with the first preset prefix, a second preset prefix including the sub-application name may be directly added in front of the current routing path.

[0069] S260, determining whether the processing of all routing paths in the routing file is completed, if so, executing S270, if not, returning to executing S230.

[0070] In this step, specifically, if the processing of all routing paths in the routing file is not completed, the operation of obtaining one routing path in the routing file as the current routing path is returned to be executed in sequence until the processing of all routing paths in the routing file is completed.

[0071] S270. Modify the dependency files to be verified in the micro front-end sub-application framework according to the project dependency files in the original front-end framework.

[0072] In an optional implementation of an embodiment of the present invention, based on the project dependency file under the original front-end framework, the dependency file to be verified in the micro-front-end sub-application framework is modified, including: in the project dependency file, obtaining the development dependency name and the development dependency version number for the development environment; in the dependency file to be verified, obtaining the dependency name and the dependency version number to be compared pre-configured in the micro-front-end sub-application framework, and comparing the dependency name to be compared with the development dependency name to determine whether there are missing development dependencies in the micro-front-end sub-application framework; if there are missing development dependencies in the micro-front-end sub-application framework, If there is a dependency for the development environment that needs to be updated in the microfrontend subapplication framework, install the missing development dependency under the microfrontend subapplication framework, and add the version number and name of the missing development dependency to the dependency file to be verified; compare the version number of the dependency to be compared with the version number of the development dependency to determine whether the version of the dependency to be compared for the development environment needs to be updated; if there is a dependency to be compared for the development environment that needs to be updated in the microfrontend subapplication framework, install the dependency to be compared for the development environment that needs to be updated under the microfrontend subapplication framework, and add the updated version number of the dependency to be compared for the development environment that needs to be updated to the dependency file to be verified.

[0073] If the project dependency file contains a development dependency name that is not recorded in the dependency file to be verified, it can be considered that there is a missing development dependency in the micro front-end sub-application framework. For the same development dependency, if the development dependency version number recorded in the dependency file to be verified is different from the development dependency version number recorded in the project dependency file, the development dependency version in the project dependency file can be updated to the micro front-end sub-application framework.

[0074] Specifically, a development dependency list including a development dependency name and a development dependency version number can be generated, and the development dependency list can be stored in a first hash set. Then, the development dependency name and the development dependency version number in the first hash set can be searched through a hash function to determine whether there are missing development dependencies in the micro-front-end sub-application framework, and whether there are dependencies to be compared for the development environment that need to be updated. Finally, a pending development dependency table can be generated based on the missing development dependencies and the dependencies to be compared for the development environment that need to be updated, and the pending development dependency table and all dependencies to be compared for the development environment that have been installed in the micro-front-end sub-application framework can be recorded.

[0075] Optionally, modifying the dependency file to be verified in the micro-frontend sub-application framework according to the project dependency file under the original front-end framework also includes: obtaining the production dependency name and production dependency version number for the production environment in the project dependency file; comparing the dependency name to be compared with the production dependency name to determine whether there are missing production dependencies in the micro-frontend sub-application framework; if there are missing production dependencies in the micro-frontend sub-application framework, installing the missing production dependencies under the micro-frontend sub-application framework, and adding the version number and name of the missing production dependencies to the dependency file to be verified; comparing the dependency version number to be compared with the production dependency version number to determine whether it is necessary to update the version of the dependency to be compared for the production environment; if there are dependencies to be compared for the production environment that need to be updated in the micro-frontend sub-application framework, installing the dependencies to be compared for the production environment that need to be updated under the micro-frontend sub-application framework, and adding the updated version number of the dependencies to be compared for the production environment that need to be updated to the dependency file to be verified.

[0076] If the project dependency file contains a production dependency name that is not recorded in the dependency file to be verified, it can be considered that there is a missing production dependency in the micro front-end sub-application framework. For the same production dependency, if the production dependency version number recorded in the dependency file to be verified is different from the production dependency version number recorded in the project dependency file, the production dependency version in the project dependency file can be updated to the micro front-end sub-application framework.

[0077] Specifically, a production dependency list including a production dependency name and a production dependency version number can be generated, and the production dependency list can be stored in a second hash set. Then, the production dependency name and the production dependency version number in the second hash set can be searched through a hash function to determine whether there are missing production dependencies in the micro-front-end sub-application framework, and whether there are dependencies to be compared for the production environment that need to be updated. Finally, a pending production dependency table can be generated based on the missing production dependencies and the dependencies to be compared for the production environment that need to be updated, and the pending production dependency table and all dependencies to be compared for the production environment that have been installed in the micro-front-end sub-application framework are recorded.

[0078] The above technical solution modifies the dependency files to be verified in the micro-frontend sub-application framework through the project dependency files under the original front-end framework, so as to install missing dependencies and update dependency versions in time, thereby ensuring the consistency and integrity of dependencies in the micro-frontend environment.

[0079] Optionally, the method further includes: after receiving a dependency version locking command input by the user, locking the version numbers of each dependency item to be compared in the modified dependency file to be verified, so as to enhance the stability of compiling the code under the micro front-end sub-application framework.

[0080] The dependency version locking command may be “npm run lock”.

[0081] Specifically, since a package manager (Node Package Manager, NPM) product library is usually used for code compilation, in order to enhance the stability of compiling the code under the micro-frontend sub-application framework, the version number of each dependency to be compared in the modified dependency file to be verified can be locked.

[0082] S280. Obtain the micro-frontend sub-application obtained after copying the business directory to be migrated, modifying the routing path, and modifying the dependent files to be verified, and integrate the micro-frontend sub-application according to the modified sub-application configuration file to obtain the web application after the micro-frontend transformation.

[0083] In an optional implementation of the embodiment of the present invention, micro-frontend sub-application integration is performed according to the modified sub-application configuration file to obtain a web application after the micro-frontend is transformed, including: after receiving the URL including the sub-application name and the sub-application port entered by the user in the browser, obtaining the sub-application configuration file in the micro-frontend sub-application framework through the front-end base that has completed the micro-frontend transformation, and comparing the sub-application name and sub-application port in the sub-application configuration file with the sub-application name and sub-application port in the URL; according to the comparison results of the sub-application name and the sub-application port, micro-frontend sub-application integration is performed to obtain the web application after the micro-frontend is transformed.

[0084] Specifically, you can sequentially obtain one as the target micro front-end sub-application in each micro front-end sub-application, and obtain the target sub-application configuration file in the target micro front-end sub-application. If the sub-application name in the target sub-application configuration file is the same as the sub-application name in the URL, and the sub-application port in the target sub-application configuration file is the same as the sub-application port in the URL, then the target micro front-end sub-application can be integrated with the front-end base. If the sub-application name in the target sub-application configuration file is different from the sub-application name in the URL, or the sub-application port in the target sub-application configuration file is different from the sub-application port in the URL, then you can return to execute the operation of sequentially obtaining one as the target micro front-end sub-application in each micro front-end sub-application until all micro front-end sub-applications are processed.

[0085] For example, assuming that the URL entered by the user in the browser is "https: / / xx.xx.xx.xx:port1 / appA", the front-end base can be used to search for the first micro-front-end sub-application whose sub-application port is port1 and whose sub-application name is appA according to the open source web server, and the first micro-front-end sub-application can be integrated with the front-end base.

[0086] The technical solution of this embodiment, by sequentially obtaining a routing path in the routing file as the current routing path, determines whether the prefix of the current routing path is the first preset prefix; wherein the first preset prefix is ​​used to indicate the entry path for accessing the web application before the micro-frontend transformation; if so, after removing the first preset prefix in the current routing path, add the second preset prefix containing the sub-application name to the current routing path; if not, directly add the second preset prefix containing the sub-application name to the current routing path. This technical means solves the problem of high coupling between the middle-end front-end basic framework and the front-end business code caused by front-end development through the existing framework, and improves the independence of the development and maintenance of web applications. Secondly, since the micro-frontend transformation is to split the web application into small modules that can be independently developed and deployed, the technical solution of this embodiment does not need to rely on the first preset prefix to obtain the front-end page. Deleting the second preset prefix on the basis of deleting the first preset prefix can improve the response efficiency of the front-end page.

[0087] Based on the above embodiments, in order to explain the micro-frontend transformation method and effect in the present invention in detail, an industrial control security software based on the Vue framework is used as an example for explanation below: On the premise that the front-end base has completed the micro-frontend transformation, the industrial control security software based on the Vue framework can be transformed into a micro-frontend through an initialization script to obtain an industrial control security software containing multiple micro-frontend sub-applications. The execution process of the initialization script is as follows: Step 1, the sub-application name, sub-application port and sub-application source code path in the script startup command can be obtained, and the sub-application name, sub-application port and sub-application source code path can be verified for legitimacy. Step 2, the sub-application name and sub-application port can be written into the sub-application configuration file (i.e., appConfig.js file) in the micro-frontend sub-application framework. Step 3, according to the sub-application source code path, the business directory to be migrated can be obtained under the original front-end framework of the web application, and the business directory to be migrated can be copied layer by layer to the micro-frontend sub-application directory of the micro-frontend sub-application framework. In addition, step 3 also includes migrating the static resources in the static resource directory to the static resource directory under the micro-frontend sub-application framework. Step 4, delete the redundant content under the micro-frontend sub-application framework, such as temporary directories and duplicate images. Step 5. For routing paths that start with " / index / ", add " / ${appname}" to the front of the routing path after deleting the leading " / index / ". For routing paths that do not start with " / index / ", add " / ${appname}" directly to the front of the routing path. Step 6. Add a comment mark before the import statement of the routing component, such as " / *webpackChunkName:"views-data region Mng-index"* / ", so that the directory structure of the micro-frontend sub-application framework can be determined according to the packaged JS file name (that is, the JavaScript file name), so as to locate the fault of the web application after the micro-frontend transformation. Step 7. Traverse the directory under the micro-frontend sub-application framework through the folder traversal function (that is, the traverseF older function), and automatically replace the import path and style reference to point to the correct path in the micro-frontend environment. For example, since the "frame" side style under the Vue framework can no longer be directly referenced under the micro-frontend sub-application framework, "@ / frame / ..." can be uniformly changed to "@ / ...". Step 8: You can perform specific string template conversion operations according to the set string template conversion rules. For example, you can replace "@ / frame / plugins / il8n" with "@ / il8n" and replace "@include productColor('theme-color')" with "color:var(--theme)".Step 9: According to the project dependency files under the original front-end framework, it can be determined whether there are missing dependencies and / or dependencies that need to be updated in the micro-front-end sub-application framework. If so, the "npminstall" command can be executed to automatically install the missing and / or updated dependencies. Step 10: In response to the "npmrun eslint" command, a code quality check can be performed to automatically modify the repairability errors, thereby improving the code quality. Step 11: In response to the "npm run lock" command input by the user, the version numbers of the dependencies to be compared in the modified dependency files to be verified are locked to enhance the stability of compiling the code under the micro-front-end sub-application framework. Step 12: The unit test of the micro-front-end sub-application can be automatically triggered, and a unit test report can be generated for the developer to review, so as to verify the correctness of the business logic and functions after the micro-front-end transformation, and ensure that the micro-front-end transformation is correct. Step 13: A routing adjustment report can be provided to the developer to ensure the accuracy of the routing change and avoid missing or incorrectly adjusting the routing path.

[0088] The advantage of this setting is that by transforming the industrial control security software based on the Vue framework into an industrial control security software including multiple micro-frontend sub-applications (that is, industrial control security software based on the micro-frontend framework), the coupling between the middle platform basic framework and the micro-frontend sub-application can be reduced, making the project iteration more efficient and smooth, and reducing the long-term maintenance cost. Secondly, through the decoupling between the middle platform basic framework and the micro-frontend sub-application, the micro-frontend sub-application can be tested independently, ensuring the application quality after each change, improving the stability and reliability of the software, and shortening the testing cycle. Thirdly, by implementing the micro-frontend transformation through the initialization script, the micro-frontend transformation work can be processed in batches, greatly improving the efficiency of the micro-frontend transformation, while ensuring the quality and code style of the transformed micro-frontend sub-applications. Finally, by creating a micro-frontend sub-application framework, on the basis of unified development specifications, the quality and consistency of micro-frontend sub-applications are improved, and team collaboration and knowledge sharing are promoted.

[0089] Embodiment 3

[0090] Figure 3 This is a structural diagram of an application transformation device based on a micro-frontend provided according to Example 3 of the present invention. This embodiment can be applied to the situation of performing micro-frontend transformation on a web application. The application transformation device based on a micro-frontend can be implemented in the form of hardware and / or software and can be configured in an electronic device such as a computer.

[0091] like Figure 3 As shown, the micro-frontend-based application transformation device disclosed in this embodiment includes: a configuration file modification module 31, a directory migration module 32, a routing path modification module 33, a dependency file modification module 34 and a micro-frontend integration module 35, wherein:

[0092] The configuration file modification module 31 is used to modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script startup command after receiving the script startup command input by the user;

[0093] The directory migration module 32 is used to obtain the business directory to be migrated in the original front-end framework of the web application according to the sub-application source code path in the script startup command, and copy the business directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework;

[0094] The routing path modification module 33 is used to obtain the routing file in the micro-frontend sub-application framework and modify each routing path in the routing file according to the sub-application name; wherein the routing path is used to obtain the front-end page of the micro-frontend sub-application, and the micro-frontend sub-application is a sub-application obtained by performing micro-frontend transformation on the business code to be migrated in the business directory to be migrated;

[0095] A dependency file modification module 34 is used to modify the dependency file to be verified in the micro-front-end sub-application framework according to the project dependency file under the original front-end framework;

[0096] The micro-frontend integration module 35 is used to obtain the micro-frontend sub-application obtained after the business directory to be migrated is copied, the routing path is modified, and the dependent file to be verified is modified, and the micro-frontend sub-application is integrated according to the modified sub-application configuration file to obtain the web application after the micro-frontend is transformed.

[0097] The technical solution in this embodiment solves the problem of high coupling between the front-end basic framework and the front-end business code of the middle platform due to the front-end development through the existing framework, through the mutual cooperation of the configuration file modification module, the directory migration module, the routing path modification module, the dependent file modification module and the micro-front-end integration module. The front-end basic framework and the front-end business code of the middle platform can be decoupled to improve the response speed of the web application. Secondly, after the decoupling of the front-end basic framework and the front-end business code of the middle platform, independent testing of the micro-front-end sub-application can be realized, thereby saving testing resources, improving iteration efficiency and reducing the risk of errors.

[0098] Optionally, the routing path modification module 33 is specifically used to: obtain a routing path in the routing file in turn as the current routing path, and determine whether the prefix of the current routing path is a first preset prefix; wherein the first preset prefix is ​​used to represent the entry path for accessing the web application before the micro-frontend transformation; if so, after removing the first preset prefix in the current routing path, add a second preset prefix containing the sub-application name to the current routing path; if not, directly add the second preset prefix containing the sub-application name to the current routing path.

[0099] Optionally, the dependent file modification module 34 includes:

[0100] The development dependency acquisition unit is used to obtain the development dependency name and development dependency version number used for the development environment in the project dependency file;

[0101] A missing development dependency determination unit is used to obtain the name of the dependency to be compared and the version number of the dependency to be compared pre-configured in the micro-frontend sub-application framework from the dependency file to be verified, and compare the name of the dependency to be compared with the name of the development dependency to determine whether there is a missing development dependency in the micro-frontend sub-application framework;

[0102] A new unit for missing development dependencies is added, which is used to install the missing development dependencies under the microfrontend sub-application framework if there are missing development dependencies in the microfrontend sub-application framework, and add the version number and name of the missing development dependency to the dependency file to be verified;

[0103] A development dependency to be updated determining unit, used to compare the version number of the dependency to be compared with the version number of the development dependency to determine whether the version of the dependency to be compared used in the development environment needs to be updated;

[0104] A development dependency update unit, for installing the dependencies to be compared for the development environment that need to be updated under the micro-frontend sub-application framework if there are dependencies to be compared for the development environment that need to be updated in the micro-frontend sub-application framework, and adding an updated version number of the dependencies to be compared for the development environment that need to be updated to the dependency file to be verified;

[0105] The production dependency acquisition unit is used to obtain the production dependency name and production dependency version number for the production environment in the project dependency file;

[0106] A missing production dependency determination unit, used to compare the dependency name to be compared with the production dependency name to determine whether there is a missing production dependency in the micro front-end sub-application framework;

[0107] A new unit for missing production dependencies is added, which is used to install the missing production dependencies under the microfrontend sub-application framework if there are missing production dependencies in the microfrontend sub-application framework, and add the version number and name of the missing production dependency to the dependency file to be verified;

[0108] A unit for determining production dependencies to be updated, used for comparing the version number of the dependency to be compared with the version number of the production dependency to determine whether the version of the dependency to be compared used in the production environment needs to be updated;

[0109] The production dependency update unit is used to install the dependencies to be compared for the production environment that need to be updated under the micro-frontend sub-application framework if there are dependencies to be compared for the production environment that need to be updated in the micro-frontend sub-application framework, and add the updated version number of the dependencies to be compared for the production environment that need to be updated to the dependency file to be verified.

[0110] Optionally, the micro front-end integration module 35 is specifically used for:

[0111] After receiving the uniform resource locator including the sub-application name and the sub-application port entered by the user in the browser, the sub-application configuration file in the micro-frontend sub-application framework is obtained through the front-end base that has completed the micro-frontend transformation, and the sub-application name and sub-application port in the sub-application configuration file are compared with the sub-application name and sub-application port in the uniform resource locator; based on the sub-application name comparison results and the sub-application port comparison results, the micro-frontend sub-application is integrated to obtain the web application after the micro-frontend transformation.

[0112] Optionally, the device further includes a dependency version locking module, which is specifically used to:

[0113] After receiving the dependency version locking command input by the user, the version numbers of the dependencies to be compared in the modified dependency file to be verified are locked to enhance the stability of compiling the code under the micro front-end sub-application framework.

[0114] Optionally, the device further includes a static resource directory replication module, which is specifically used to:

[0115] Get the static resource directory under the original front-end framework, and migrate the static resources in the static resource directory to the static resource directory under the micro-front-end sub-application framework.

[0116] The micro-frontend-based application transformation device provided in the embodiment of the present invention can execute the micro-frontend-based application transformation method provided in any embodiment of the present invention, and has the corresponding functional modules and beneficial effects of the execution method. For the contents not described in detail in this embodiment, please refer to the description in any method embodiment of this application.

[0117] Embodiment 4

[0118] Figure 4 A schematic structural diagram of an electronic device 10 that can be used to implement an embodiment of the present invention is shown.

[0119] like Figure 4As 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.

[0120] 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.

[0121] 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, digital signal processors (DSPs), and any appropriate processors, controllers, microcontrollers, etc. The processor 11 executes the various methods and processes described above, such as a micro-front-end-based application transformation method.

[0122] In some embodiments, the micro-frontend-based application transformation method 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 micro-frontend-based application transformation method described above may be performed. Alternatively, in other embodiments, the processor 11 may be configured to execute the micro-frontend-based application transformation method in any other appropriate manner (e.g., by means of firmware).

[0123] 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), complex 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.

[0124] 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.

[0125] 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.

[0126] To provide interaction with a software 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 software user; and a keyboard and pointing device (e.g., a mouse or trackball) through which the software user can provide input to the electronic device. Other types of devices may also be used to provide interaction with a software user; for example, the feedback provided to the software user may be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the software user may be received in any form (including acoustic input, voice input, or tactile input).

[0127] 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 software user computer with a graphical software user interface or a web browser through which a software 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.

[0128] 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.

[0129] 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.

[0130] 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 micro-frontend-based application transformation method, characterized in that: The method comprises: After receiving the script start command input by the user, modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script start command; According to the sub-application source code path in the script startup command, obtain the service directory to be migrated under the original front-end framework of the web application, and copy the service directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework; Obtain a routing file in the micro-frontend sub-application framework, and modify each routing path in the routing file according to the sub-application name; wherein the routing path is used to obtain the front-end page of the micro-frontend sub-application, and the micro-frontend sub-application is a sub-application obtained by performing micro-frontend transformation on the service code to be migrated in the service directory to be migrated; Modify the dependency files to be verified in the micro-frontend sub-application framework according to the project dependency files under the original front-end framework; The micro-frontend sub-application is obtained after the business directory to be migrated is copied, the routing path is modified, and the dependent files to be verified are modified. The micro-frontend sub-application is integrated according to the modified sub-application configuration file to obtain the web application after the micro-frontend transformation.

2. The method according to claim 1, characterized in that Modify each routing path in the routing file according to the sub-application name, including: Obtaining a routing path in the routing file in turn as the current routing path, and determining whether a prefix of the current routing path is a first preset prefix; The first preset prefix is ​​used to represent the entry path for accessing the web application before the micro-frontend transformation; If yes, then after removing the first preset prefix in the current routing path, add a second preset prefix including the sub-application name in the current routing path; If not, directly add the second preset prefix containing the sub-application name to the current routing path.

3. The method according to claim 1, characterized in that According to the project dependency files under the original front-end framework, modify the dependency files to be verified in the micro-front-end sub-application framework, including: In the project dependency file, get the development dependency name and development dependency version number for the development environment; In the dependency file to be verified, obtain the name of the dependency to be compared and the version number of the dependency to be compared pre-configured in the micro-frontend sub-application framework, and compare the name of the dependency to be compared with the name of the development dependency to determine whether there is a missing development dependency in the micro-frontend sub-application framework; If there are missing development dependencies in the microfrontend sub-application framework, install the missing development dependencies under the microfrontend sub-application framework and add the version number and name of the missing development dependencies to the dependency file to be verified; Compare the version number of the dependency to be compared with the version number of the development dependency to determine whether the version of the dependency to be compared used in the development environment needs to be updated; If there are dependencies to be compared for the development environment that need to be updated in the micro front-end sub-application framework, the dependencies to be compared for the development environment that need to be updated are installed under the micro front-end sub-application framework, and the updated version number of the dependencies to be compared for the development environment that need to be updated is added to the dependency file to be verified.

4. The method according to claim 3, characterized in that According to the project dependency files under the original front-end framework, modifying the dependency files to be verified in the micro-front-end sub-application framework also includes: In the project dependency file, obtain the production dependency name and production dependency version number for the production environment; Compare the names of the dependencies to be compared with the names of the production dependencies to determine whether there are missing production dependencies in the micro-frontend sub-application framework; If there are missing production dependencies in the microfrontend sub-application framework, install the missing production dependencies under the microfrontend sub-application framework and add the version number and name of the missing production dependencies to the dependency file to be verified; Compare the version number of the dependency to be compared with the version number of the production dependency to determine whether the version of the dependency to be compared used in the production environment needs to be updated; If there are dependencies to be compared for the production environment that need to be updated in the micro front-end sub-application framework, the dependencies to be compared for the production environment that need to be updated are installed under the micro front-end sub-application framework, and the updated version number of the dependencies to be compared for the production environment that need to be updated is added to the dependency file to be verified.

5. The method according to claim 1, characterized in that According to the modified sub-application configuration file, the micro-frontend sub-application is integrated to obtain the web application after the micro-frontend transformation, including: After receiving the uniform resource locator including the sub-application name and the sub-application port input by the user in the browser, obtain the sub-application configuration file in the micro-frontend sub-application framework through the front-end base that has completed the micro-frontend transformation, and compare the sub-application name and the sub-application port in the sub-application configuration file with the sub-application name and the sub-application port in the uniform resource locator; According to the sub-application name comparison results and the sub-application port comparison results, the micro-frontend sub-application is integrated to obtain the web application after the micro-frontend transformation.

6. The method according to any one of claims 1 to 5, characterized in that: The method further comprises: After receiving the dependency version locking command input by the user, the version numbers of the dependencies to be compared in the modified dependency file to be verified are locked to enhance the stability of compiling the code under the micro front-end sub-application framework.

7. The method according to any one of claims 1 to 5, characterized in that: The method further comprises: Get the static resource directory under the original front-end framework, and migrate the static resources in the static resource directory to the static resource directory under the micro-front-end sub-application framework.

8. An application transformation device based on micro front-end, characterized in that: The device comprises: A configuration file modification module is used to modify the sub-application configuration file in the pre-built micro front-end sub-application framework according to the sub-application name and sub-application port in the script startup command after receiving the script startup command input by the user; A directory migration module, used to obtain a service directory to be migrated in the original front-end framework of the web application according to the sub-application source code path in the script startup command, and copy the service directory to be migrated layer by layer to the micro-front-end sub-application directory of the micro-front-end sub-application framework; A routing path modification module, used to obtain a routing file in a micro-frontend sub-application framework, and to modify each routing path in the routing file according to the sub-application name; wherein the routing path is used to obtain a front-end page of a micro-frontend sub-application, and the micro-frontend sub-application is a sub-application obtained by performing a micro-frontend transformation on the service code to be migrated in the service directory to be migrated; A dependency file modification module, used to modify the dependency file to be verified in the micro-front-end sub-application framework according to the project dependency file under the original front-end framework; The micro-frontend integration module is used to obtain the micro-frontend sub-application after copying the business directory to be migrated, modifying the routing path and modifying the dependent files to be verified, and integrate the micro-frontend sub-application according to the modified sub-application configuration file to obtain the web application after the micro-frontend transformation.

9. 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 execute the micro-frontend-based application transformation method described in any one of claims 1-7.

10. 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 micro-frontend-based application transformation method described in any one of claims 1 to 7 when executed.

Images