概述
microstar 是一个在浏览器环境下面使用的微前端框架，它能够帮助我们实现将一个大型 web 应用按角色和业务功能拆分成多个小型应用，每个小型应用可独立开发、维护、部署与升级。microstar 还支持按需加载增量应用，并且支持跨级调用与 DOM 隔离。
本文介绍如何使用 microstar 包，来快速搭建一个微前端应用。
安装
微前端需要使用到 microstar npm 包，所以我们需要在项目中安装它，使用 npm install microstar 命令即可。
npm install microstar
快速使用
microstar 的最小用法就是在页面上通过 <script> 标签来引入一个远程模块，并使用微前端框架进行包裹：
-- -------------------- ---- -------
---- ---------------
------- --------------------------------- ----------------------------
------- --------------------------------- ----------------------------
------- --------------------------------- ----------------------------
--------
------ --------- ---- -----------
---
- ---- --------- --
--
----- -- - --- -----------------------------------------
---
- ---------
--
------------------------------------------- -------- -- -
---
- ---------
--
----------
--
---------注意：以上代码是在已经使用 webpack 打包的情况下，因此可以使用 import 语句。
模块通信
在微前端架构中，一个大型的 web 应用由许多小型的应用组成，应用与应用之间需要互相通信，microstar 为我们提供了方便而适合的 API，让我们方便地从应用外部向应用内部通信，或从应用内部向应用外部通信。
-- -------------------- ---- ------- --- - ----------- ---- -- ---- ---- - - ---- - ---- ---------------- -- ----- -- - --- ----------------------------------------- -- --------- -------------------- ---- -- - -------------- -- -- ------ ---------------------- ------- --------
生命周期
microstar 中每个应用的实例上都有一些生命周期方法，用于在应用启动前和启动后分别进行初始化和销毁操作。如下是一个示例：
-- -------------------- ---- -------
----- -- - --- -----------
----- --- - -------------------- -
------ -- -
----------------------
------ -
----- -
----- -----
---- --
-
-
--
----- ------ -
---------------- ------
-----------------
--
------- -- -
---------------- ------
-
--
-- ------
--------------- - -------- -- -
-------------------------------
-
-- ------
-------------- - -------- -- -
-------------------------------
-
-- ----
-----------总结
本文介绍了如何使用 microstar 这个 npm 包来构建一个微前端应用。你可以通过 npm install microstar 来安装它，然后引用它，在 script 中引入远程模块，也可以使用 createApp 来创建应用实例。除了这些，还有其他的配置项和 API，有兴趣的读者可以阅读其官方文档。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f471d8e776d08041033