CN113721912B - Dynamic subpackaging and packing method of micro front-end framework based on umi - Google Patents

Dynamic subpackaging and packing method of micro front-end framework based on umi Download PDF

Info

Publication number
CN113721912B
CN113721912B CN202111012129.0A CN202111012129A CN113721912B CN 113721912 B CN113721912 B CN 113721912B CN 202111012129 A CN202111012129 A CN 202111012129A CN 113721912 B CN113721912 B CN 113721912B
Authority
CN
China
Prior art keywords
umi
module
sub
scaffold
plug
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN202111012129.0A
Other languages
Chinese (zh)
Other versions
CN113721912A (en
Inventor
梁伟童
王智威
刘洪文
吴名朝
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Whale Cloud Technology Co Ltd
Original Assignee
Whale Cloud Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Whale Cloud Technology Co Ltd filed Critical Whale Cloud Technology Co Ltd
Priority to CN202111012129.0A priority Critical patent/CN113721912B/en
Publication of CN113721912A publication Critical patent/CN113721912A/en
Application granted granted Critical
Publication of CN113721912B publication Critical patent/CN113721912B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/40Transformation of program code
    • G06F8/41Compilation
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/70Software maintenance or management
    • G06F8/71Version control; Configuration management

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Computer Security & Cryptography (AREA)
  • Data Exchanges In Wide-Area Networks (AREA)

Abstract

The invention discloses a dynamic subpackaging and packing method of a micro front end framework based on umi, which comprises the following steps: configuring a unified scaffold and building sub-module projects and pages through simple commands; processing the code moved by the scaffold through a self-contained plug-in a submodule generated by the scaffold; configuring a self-contained plug-in the main module; configuring a scaffold base, pulling the version information of the sub-modules from the configuration project to the local, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules; in the operation state, the main module dynamically loads resources when opening the menu, if the menu is in a sub-package mode, static resources of sub-modules corresponding to the routing url are remotely loaded, and increment internationalization, routing and model data carried by the static resources are analyzed and injected into the main module. Has the beneficial effects that: the problems of slow loading and redundancy in the prior art are solved.

Description

Dynamic subpackaging and packing method of micro front-end framework based on umi
Technical Field
The invention relates to the field of micro front ends, in particular to a dynamic subpackaging and packing method of a micro front end framework based on umi.
Background
In recent years, the front-end technology has been rapidly developed, and excellent front-end frameworks such as fact and Vue (both JavaScript frameworks) have emerged. However, with the iteration of functions, the routes are more and more, the volume of the front-end bag is larger and larger, and the compiling of the front-end engineering is slower and slower. With the increase of the team scale, only a few people submit in git (a mainstream code hosting technology) originally, and the submission is changed into the submission of dozens of people in git warehouse, so that the code specification, the code dependence and the code conflict are difficult to avoid, the code is more and more bloated, and the management cost is also more and more high.
Therefore, in general, a new warehouse is created on git, one new warehouse corresponds to one sub-module project, and the respective team groups correspond to different sub-module projects. Once more sub-modules are added, more complex situations are encountered. For example, in the deployment problem, after the sub-modules git are separated, the pages of the two modules are associated with each other, and then the integration is generally performed by using iframe (embedded framework). The iframe integrates pages of other modules, so that not only is the customer experience poor, but also the page loading efficiency is extremely slow. Because single-page applications are abundant at present, even if remote loading is performed, the packaging of the sub-modules is repeated by other modules, and the size of the packaged sub-modules is too large, so that the loading is slow. For example, module a depends on Jquery (100kb), which is a compact and fast JavaScript library, and module B also depends on Jquery (100kb), which results in great redundancy and waste of dependency.
An effective solution to the problems in the related art has not been proposed yet.
Disclosure of Invention
Aiming at the problems in the related art, the invention provides a dynamic sub-packaging and packet-combining method of a micro front-end framework based on umi, so as to overcome the technical problems in the prior related art.
Therefore, the invention adopts the following specific technical scheme:
the dynamic subpackaging and packing method of the micro front end framework based on the umi comprises the following steps:
s1, configuring a unified scaffold, and building sub-module projects and pages through simple commands;
s2, processing the code moved by the scaffold through a self-contained plug-in the submodule generated by the scaffold, and dynamically generating submodule.js;
s3, configuring a self-contained plug-in the main module;
s4, configuring a scaffold base, pulling the version information of the sub-modules from the configuration items to the local, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules;
and S5, in the running state, the main module dynamically loads resources when opening the menu, remotely loads static resources of the submodules corresponding to the routing url if the menu is in the subpackaging mode, analyzes the increment internationalization, the routing and the model data carried by the static resources after dynamic loading, and injects the data into the main module.
Further, the unified scaffold includes: the method comprises the steps of quickly generating a project, a module and a page.
Further, the processing of the code moved from the scaffold by the plug-in module in the submodule generated in the scaffold in S2 and the dynamic generation of submodule.
S21, processing the code moved by the scaffold through a umi-plugin-bdpcloud plug-in, wherein the code moving process is to use the synchronous moving file and folder function of the fsExtra of nodejs;
s22, if the variable @/conflicts with the current project, replacing the global variable in a joint mode;
s23, if the directory is reduced by one level, the international file is supplemented;
and S24, dynamically generating submodule js in a json mode from internationalized files, routing files and models when the submodules are packaged through the umi-plugin-monosphere plug-in.
Furthermore, when the umi-plugin-monosphere plug-in packages the sub-modules in S24, dynamically generates submodule.js in a json manner for internationalized files, routing files and models, and the umi framework calls webpack compiling based on the submodule.js.
Further, in the S3, the plug-in module in the main module includes umi-plug-in, umi-plug-built and umi-plug-mono;
wherein, when the umi-plug-element is used, the method also comprises the following steps:
in the packet combination mode, checking whether the packet lacks a module or not, and if the packet lacks the module, exiting;
the use of umi-plugin-built also comprises the following steps:
packing the third-party components into dist by using the webpack packing capability provided by umi;
the use of umi-plugin-monoorepo also comprises the following steps:
the wedpcack's exceptions are injected at the master module and the common dependencies are pulled out to the content distribution network.
Further, the step of configuring the scaffold base in S4, pulling the version information of the sub-module from the configuration item to the local, and dynamically pulling the version corresponding to the git remote warehouse to the local compiling according to the version information of the sub-module further includes the following steps:
s41, compiling an encapsulation command npm run clone env (develoop module) dap by the scaffold base based on nodejs, simultaneously pulling the version information of the sub-modules from the configuration item to the local according to env parameters, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules;
s42, if the mode is the package combination mode, the sub-module/src/pages are moved to the/src/pages corresponding to the main module, and plug-in compiling in S3 is called.
Further, the method for compiling the group package further comprises the following steps:
the scaffold base actively goes to the git remote warehouse in parallel to pull each module to local compiling by utilizing the efficient asynchronous programming characteristic of nodejs;
if the sub-module/src/pages is in the combined mode, the sub-module/src/pages is moved to the/src/pages corresponding to the main module, and corresponding operation is performed after the movement is completed;
umi generates the front-end package dist through web package construction.
Further, in the corresponding operation after the relocation, the corresponding operation includes global variable replacement, internationalization supplementation and verification.
Further, the independent packaging of the sub-modules by sub-packages further comprises the following steps:
utilizing a scaffold command to drop each sub-module clone to a main directory for packaging;
when the umi-plugin-monosphere plug-in packages the sub-modules, dynamically generating submodule.js by internationalized files, routing files and models in a json mode;
the umi framework calls webpack decompilation based on this and gets dynamically fetched through routing when finally used.
Further, the dynamic route acquisition further includes the following steps:
when a routing menu is opened, judging whether the routing is sub-module routing, if so, carrying out remote loading, and adding a location/module reverse proxy to each module static resource directory in nginx to obtain corresponding static resources;
g _ routes extracts the routing information of the increment js by utilizing a umi global hook window;
if the model data of dva is used, registering to the global by using window.g _ app.model;
if for internationalized files, the locale is supplemented with window.
The invention has the beneficial effects that: the invention is based on the umi-based micro front-end framework of dynamic subpackaging and packaging, and allows each submodule to operate independently in the git warehouse. Even if the team reaches the scale of dozens of people, the independent git can be formed through reasonably splitting the module, the management is convenient, and the code submission and merging conflict is easy to solve. The deployment state can pull, merge and pack each submodule, and the problem of public dependence is solved. Meanwhile, sub-packaging is supported, sub-module routing is dynamically pulled, the packaging volume of the front end of the sub-module is minimized, and the problems of slow loading and redundancy in the prior art are solved.
Drawings
In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings needed in the embodiments will be briefly described below, and it is obvious that the drawings in the following description are only some embodiments of the present invention, and it is obvious for those skilled in the art to obtain other drawings without creative efforts.
FIG. 1 is a flow diagram of a method for dynamic packetization and packetization of umi-based micro-front-end frameworks in accordance with an embodiment of the present invention;
FIG. 2 is one of the schematic diagrams of the relevant operation commands in step S1;
FIG. 3 is a second schematic diagram of the related operation command in step S1;
FIG. 4 is a third schematic diagram of the related operation command in step S1;
FIG. 5 is a schematic diagram of the relevant operation command in step S4;
FIG. 6 is a schematic diagram of the compilation of a package;
FIG. 7 is a schematic illustration of the principle of packetization;
fig. 8 is a schematic diagram of dynamic route acquisition.
Detailed Description
For further explanation of the various embodiments, the drawings which form a part of the disclosure and which are incorporated in and constitute a part of this specification, illustrate embodiments and, together with the description, serve to explain the principles of operation of the embodiments, and to enable others of ordinary skill in the art to understand the various embodiments and advantages of the invention, and, by reference to these figures, reference is made to the accompanying drawings, which are not to scale and wherein like reference numerals generally refer to like elements.
According to the embodiment of the invention, a dynamic sub-packaging and packaging method of a micro front-end framework based on umi is provided, based on the umi (Chinese can be pronounced into Umi, which is a pluggable enterprise-level React application framework) framework, different sub-modules are dynamically cloned to a main module, and the framework idea of monosphere (in a simple way, all codes of a company are put into a code warehouse of Git/Subversion and the like) is realized, so that the component dependence problem among the sub-modules is greatly reduced, and the dependence management of each component is simplified. The difference between the method and other monosphere modes in the market is that each sub-module is stored in different git warehouses and can be pulled to independently operate the main module. The submodule is developed and pulled to the main module when testing or production deployment, and is compiled and packed after calculation dependence. Meanwhile, the invention can also adopt a 'subpackage' mode, each submodule is compiled into a front-end resource package such as js, css, pictures and the like which can independently run, different directories of the server are separately deployed, and finally, the static resource of the submodule is dynamically pulled when the main module loads the route, so that the concept of multirepo (namely, a plurality of gits/Subversion and the like are used for managing the source code of the submodule, which is opposite to Monorepo) is realized. The invention is different from other multiipo in that the dependence of the sub-modules is consistent with that of the main module, the problem of inconsistent dependence under the subpackage condition can be perfectly solved, the independent operation capability can be provided for each sub-module, and the module can be independently upgraded and deployed under the condition that other modules are not changed.
The present invention will be further described with reference to the accompanying drawings and specific embodiments, and as shown in fig. 1, a method for dynamically packetizing and packetizing umi-based micro front-end frameworks according to an embodiment of the present invention includes the following steps:
s1, configuring a unified scaffold, and quickly building sub-module projects and pages within 5min through simple commands;
the unified scaffold includes: the method comprises the steps of quickly generating a project, a module and a page. The relevant operation commands are detailed in fig. 2-4.
Demonstration of a template: a bdp-tpl-sub (a code generation template provided by the scaffold of the invention) template is taken as a project; a module-base-blk (a code generation template provided by the scaffold of the invention) template is taken as a module; taking a page-table-card (a code generation template provided by the scaffold of the invention) template as a page; (subSystem)
S2, processing the code moved by the scaffold through the plug-in module in the submodule generated by the scaffold, and dynamically generating submodule.js; (submodule is a submodule)
In S2, the code moved from the scaffold is processed by a self-contained plug-in the submodule generated by the scaffold, and the dynamically generating submodule.js further includes the following steps:
s21, processing the code moved by the scaffold by a umi-plugin-bdpcloud (the invention provides a plugin written by api by umi), wherein the code moving process is the synchronous moving file and folder function of fsExtra (a module) by nodejs (a Javascript operating environment based on a V8 engine);
s22, if the variable @/conflicts with the current item, replacing the global variable in a joint mode (for example @/page/dap is replaced by @ dap);
s23, if the directory is reduced to one level (/ src/locales is degraded to/src/module/locales), and the locales folder cannot be found, performing internationalization file supplement;
s24, dynamically generating submodules by means of a umi-plugin-monosphere (plug-in written by the present invention by providing an api with umi) plug-in when packing the submodules (umi api. ontenerate files event hook), and using json (JavaScript Object Notation) to generate the internationalized files, the routing files, and the models (refer to dva provide packed models).
When the child modules are packaged by umi-plugin-monosphere plug-ins in the S24, and the internationalized files, the routing files and the models dynamically generate submodules in a json manner, the umi framework calls webpack (a static module packaging tool for modern JavaScript applications) to compile based on the submodules.
S3, configuring a self-contained plug-in the main module; (mainSystem Main System)
In S3, the plug-ins in the main module include umi-plug-in (the plug-in is written by umi, which is provided by umi in the present disclosure), umi-plug-built (the plug-in is written by umi, which is provided by umi in the present disclosure), and umi-plug-mono-o;
wherein, when the umi-plug-element is used, the method also comprises the following steps:
in the packet combination mode, checking whether the packet lacks a module or not, and if the packet lacks the module, exiting;
the use of umi-plug-built also comprises the following steps:
packaging into a dist for a third party component by using the webpack packaging capability provided by umi (for example, an exposure src can be packaged into a dist by using the webpack packaging capability provided by umi);
the use of umi-plugin-monoorepo also comprises the following steps:
the wedpcack's exceptions are injected at the master module and the common dependencies are pulled cdn (content distribution network).
S4, configuring a scaffold base (named as 'env-act'), pulling the version information of the sub-modules to the local from the configuration item, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules; the relevant operation commands and outputs are detailed in fig. 5.
Wherein, the step of configuring the scaffold base in S4, pulling the version information of the sub-module from the configuration item to the local, and simultaneously dynamically pulling the version corresponding to the git remote warehouse to the local for compilation according to the version information of the sub-module further comprises the following steps:
s41, compiling an encapsulation command npm run clone env (develoop module) dap by the scaffold base based on nodejs, simultaneously pulling the version information of the sub-modules from the configuration item to the local according to env parameters, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules;
s42, if the mode is the package combination mode, the sub-module/src/pages are moved to the/src/pages corresponding to the main module, and plug-in compiling in S3 is called.
And S5, in the running state, the main module dynamically loads resources when opening the menu, remotely loads static resources of the submodules corresponding to the routing url if the menu is in the subpackaging mode, analyzes the increment internationalization, the routing and the model data carried by the static resources after dynamic loading, and injects the data into the main module. This opens the routing menu for the sub-module.
In one embodiment, as shown in fig. 6, the compilation of the package further includes the following steps:
the scaffold base actively goes to the git remote warehouse in parallel to pull each module to local compiling by utilizing the efficient asynchronous programming characteristic of nodejs;
if the sub-module/src/pages is in the combined mode, the sub-module/src/pages is moved to the/src/pages corresponding to the main module, and corresponding operation is performed after the movement is completed;
umi generates the front-end packet dist through a webpack build command.
In an embodiment, as shown in fig. 7, in the corresponding operation after the relocation is completed, the corresponding operation includes replacing a global variable, supplementing internationalization, and checking.
In one embodiment, the independently packaging the sub-modules by sub-packaging further comprises the following steps: (different from the combination package mode of actively pulling codes to the main module code catalog mode, independently packaging the sub-modules)
Utilizing a scaffold command to drop each sub-module clone to a main directory for packaging;
when the umi-plugin-monosphere plug-in packages sub-modules (umi api. ontenerate files event hooks), dynamically generating submodule. js by internationalized files, routing files and models in a json mode;
the umi framework calls webpack decompilation based on this, and is dynamically acquired through routing when finally used.
In one embodiment, as shown in fig. 8, the dynamically acquiring the route further includes the following steps:
when a routing menu is opened, judging whether the routing is sub-module routing, if so, remotely loading, and adding a location/module reverse proxy to each module static resource directory in nginx (a high-performance HTTP and reverse proxy server), and if the module A is accessed, the nginx proxies to/A directory to obtain corresponding static resources, as shown in FIG. 8;
g _ routes extracts the routing information of the increment js by utilizing a umi global hook window;
if the model data of dva is used, registering to the global by using window.g _ app.model;
for internationalized files, log is supplemented with window.
And opening the network viewing debugger in different modes on the same page, wherein the viewed network requests are completely different. In the packet combining mode, the front-end resources are huge, the volume of several main js is more than 10M in total, and the loading time is close to 10 seconds. But in the packetization mode the front-end volume is greatly reduced, in particular the common js is reduced to 1M. Meaning that the first screen opens the menu much faster, only the load sub-module loads the js resource of 3.8M as needed. This is a significant innovation and is the greatest advantage of the present invention.
In summary, the present invention allows independent git warehouses for each sub-module, which operates independently, based on umi's dynamic subcontracting and subcontracting micro-front-end framework. Even if the team reaches the scale of dozens of people, the team can form independent git through reasonable splitting modules, the management is convenient, and the problem of code submission and merging conflict is easily solved. The deployment state can pull, merge and pack each submodule, and the problem of public dependence is solved. Meanwhile, sub-packaging is supported, sub-module routing is dynamically pulled, the packaging volume of the front end of the sub-module is minimized, and the problems of slow loading and redundancy in the prior art are solved.
The above description is only for the purpose of illustrating the preferred embodiments of the present invention and is not to be construed as limiting the invention, and any modifications, equivalents, improvements and the like that fall within the spirit and principle of the present invention are intended to be included therein.

Claims (9)

1. The dynamic subpackaging and packing method of the micro front end framework based on the umi is characterized by comprising the following steps of:
s1, configuring a unified scaffold, and building sub-module projects and pages through simple commands;
s2, processing the code moved by the scaffold through a self-contained plug-in the submodule generated by the scaffold, and dynamically generating submodule.js;
s3, configuring a self-contained plug-in the main module;
s4, configuring a scaffold base, pulling the version information of the sub-modules from the configuration items to the local, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules;
s5, in the operation state, the main module dynamically loads resources when opening the menu, if the menu is in a sub-package mode, the static resources of the sub-module corresponding to the routing url are remotely loaded, and after dynamic loading, increment internationalization, routing and model data carried by the static resources are analyzed and injected into the main module;
the step S2 of processing the code transferred from the scaffold by using the plug-in module of the submodule generated by the scaffold, and dynamically generating the submodule.js further includes the following steps:
s21, processing the code moved by the scaffold through a umi-plugin-bdpcloud plug-in, wherein the code moving process is to use the synchronous moving file and folder function of the fsExtra of nodejs;
s22, if the variable @/conflicts with the current project, replacing the global variable in a joint mode;
s23, if the directory is reduced by one level, the international file is supplemented;
and S24, dynamically generating submodule js in a json mode from internationalized files, routing files and models when the submodules are packaged through the umi-plugin-monosphere plug-in.
2. The umi-based micro-front-end framework dynamic packetization and packetization method according to claim 1, wherein the unified scaffold comprises: the method comprises the steps of quickly generating a project, a module and a page.
3. The umi-based micro-front-end framework dynamic subpackaging and packaging method according to claim 1, wherein when internationalized files, routing files and models are dynamically generated in json mode to submodule js through umi-plugin-monosphere plug-in S24, the umi framework calls webpack compiling based on the json-Jon-JO.
4. The method for dynamic subcontracting and subcontracting of umi-based micro-front-end framework according to claim 1, wherein the plug-ins in the master module in S3 comprise umi-plugin-increment, umi-plugin-build and umi-plugin-monosphere;
wherein, when the umi-plug-element is used, the method also comprises the following steps:
in the packet combination mode, checking whether the packet lacks a module or not, and if the packet lacks the module, exiting;
the use of umi-plug-built also comprises the following steps:
packing the third-party components into dist by using the webpack packing capability provided by umi;
the use of umi-plugin-monoorepo also comprises the following steps:
the wedpcack's exceptions are injected at the master module and the common dependencies are pulled out to the content distribution network.
5. The umi-based micro-front-end framework dynamic subpackaging and packaging method according to claim 1, wherein the step of configuring a scaffold base in S4, pulling version information of sub-modules from configuration items to local, and dynamically pulling the corresponding versions of git remote warehouses to local compiling according to the version information of the sub-modules further comprises the following steps:
s41, writing an encapsulation command npm run clone env = develop module = dap by the scaffold base based on nodejs, simultaneously pulling the version information of the sub-modules from the configuration item to the local according to env parameters, and dynamically pulling the version corresponding to the git remote warehouse to the local for compiling according to the version information of the sub-modules;
s42, if the mode is the package combination mode, the sub-module/src/pages are moved to the/src/pages corresponding to the main module, and plug-in compiling in S3 is called.
6. The umi-based micro-front-end framework dynamic packetization and packetization method according to claim 5, wherein the packetization compile time further comprises the steps of:
the scaffold base actively goes to the git remote warehouse in parallel to pull each module to local compiling by utilizing the efficient asynchronous programming characteristic of nodejs;
if the sub-module/src/pages is in the combined mode, the sub-module/src/pages is moved to the/src/pages corresponding to the main module, and corresponding operation is performed after the movement is completed;
umi generates the front-end package dist through web package construction.
7. The umi-based micro-front-end framework dynamic subpackaging and packaging method according to claim 6, wherein in the corresponding operation after the completion of the relocation, the corresponding operation comprises global variable replacement, internationalization supplementation and verification.
8. The umi-based micro-front-end framework dynamic packetization and packetization method according to claim 7, wherein the packetization sub-module independently packetization further comprises the steps of:
utilizing a scaffold command to drop each sub-module clone to a main directory for packaging;
when the umi-plugin-monosphere plug-in packages the sub-modules, dynamically generating submodule.js by internationalized files, routing files and models in a json mode;
the umi framework calls webpack decompilation based on this and gets dynamically fetched through routing when finally used.
9. The umi-based micro-front-end framework dynamic packetization and packetization method according to claim 8, wherein the route dynamic acquisition further comprises the steps of:
when a routing menu is opened, judging whether the routing is sub-module routing, if so, carrying out remote loading, and adding a location/module reverse proxy to each module static resource directory in nginx to obtain corresponding static resources;
g _ routes extracts the routing information of the increment js by utilizing a umi global hook window;
if the model data of dva is used, registering to the global by using window.g _ app.model;
for internationalized files, log is supplemented with window.
CN202111012129.0A 2021-08-31 2021-08-31 Dynamic subpackaging and packing method of micro front-end framework based on umi Active CN113721912B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111012129.0A CN113721912B (en) 2021-08-31 2021-08-31 Dynamic subpackaging and packing method of micro front-end framework based on umi

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111012129.0A CN113721912B (en) 2021-08-31 2021-08-31 Dynamic subpackaging and packing method of micro front-end framework based on umi

Publications (2)

Publication Number Publication Date
CN113721912A CN113721912A (en) 2021-11-30
CN113721912B true CN113721912B (en) 2022-09-16

Family

ID=78679784

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111012129.0A Active CN113721912B (en) 2021-08-31 2021-08-31 Dynamic subpackaging and packing method of micro front-end framework based on umi

Country Status (1)

Country Link
CN (1) CN113721912B (en)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN115390879B (en) * 2022-09-14 2023-12-22 安徽长江工业大数据科技股份公司 Method for constructing real-time management umi project code through node

Family Cites Families (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9910644B2 (en) * 2015-03-03 2018-03-06 Microsoft Technology Licensing, Llc Integrated note-taking functionality for computing system entities
EP3447635A1 (en) * 2017-08-01 2019-02-27 Accenture Global Solutions Limited Application architecture generation
CN110580146B (en) * 2018-06-07 2023-05-23 北京怡合春天科技有限公司 Mixed application solving system based on eros
US10678600B1 (en) * 2019-03-01 2020-06-09 Capital One Services, Llc Systems and methods for developing a web application using micro frontends
US10649745B1 (en) * 2019-06-10 2020-05-12 Capital One Services, Llc User interface common components and scalable integrable reusable isolated user interface
US11170065B2 (en) * 2020-02-07 2021-11-09 Citrix Systems, Inc. Technology agnostic UI microservices
CN112052011A (en) * 2020-10-10 2020-12-08 腾讯科技(深圳)有限公司 Method and device for combining small programs, electronic equipment and medium
CN112230918B (en) * 2020-10-15 2022-08-19 四川长虹电器股份有限公司 Web end development method using iframe embedded webpage
CN112835559B (en) * 2021-01-28 2023-08-11 北银金融科技有限责任公司 Design and implementation method of micro front end in north-silver financial scene construction
CN112860236A (en) * 2021-02-08 2021-05-28 杭州玳数科技有限公司 Single-spa-based micro front-end technology

Also Published As

Publication number Publication date
CN113721912A (en) 2021-11-30

Similar Documents

Publication Publication Date Title
CN111158818B (en) Page rendering method and device
CN111737032B (en) Subprogram running method and device based on microkernel system and electronic equipment
CN111273898A (en) Web front-end code automatic construction method, system and storage medium
US9992268B2 (en) Framework for thin-server web applications
CN110780853A (en) Front end framework, development method, storage medium and electronic device
CN107817978B (en) Method and device for generating executable file
CN111381852A (en) Application dynamic updating method and device based on Flutter, storage medium and electronic equipment
CN111008019B (en) Web running method, device, equipment and medium of small program
CN102495735A (en) Web end UI (user interface) component application frame system
Hales HTML5 and JavaScript Web Apps: Bridging the gap between the web and the mobile web
CN110442327B (en) Application program construction method, device and server
CN111240684B (en) Cutting method and device of JS codes, medium and electronic equipment
CN110806868A (en) Single-page building and loading method
CN107807859A (en) A kind of FaaS frameworks and its method of work, the system of exploitation O&M FaaS frameworks
CN110457656A (en) A kind of document display method and apparatus
CN111857658A (en) Method, device, medium and electronic equipment for rendering dynamic component
CN113721912B (en) Dynamic subpackaging and packing method of micro front-end framework based on umi
CN111209010A (en) Platform and implementation method thereof
CN115982491A (en) Page updating method and device, electronic equipment and computer readable storage medium
CN111459497A (en) WebPack-based resource package compiling method, system, server and storage medium
CN101876998B (en) Method and system for editing data
CN117519877A (en) Rendering method and device of quick application card, storage medium and electronic equipment
CN113268239A (en) Desktop application view construction method, device, equipment and storage medium
Wettinger et al. Any2API-Automated APIfication
Kankaala Enhancing E-commerce with Modern web technologies

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant