micro-application {docsify-ignore-all}

<micro-application> 元素支持用户开发一个完整的微前端应用作为App视图页面，
子应用接入流程与 qiankun 一致。

与 <custom-component> 的区别是 <custom-component> 通常作为一个组件，
是视图页面的一部分，只支持单个 js 文件引入，而 <micro-application> 通常作为一个完整的视图页面应用来开发。

属性

子元素

文件路径

• js 引入当前 app 下的 appserver/static/js 文件
• css 引入当前 app 下的 appserver/static/css 文件

例子

<micro-application src="main.js">
  <dependencies>
    <scripts>
      <source>vender.js</source>
      <source>common.js</source>
      <source>0.js</source>
      <source>1.js</source>
    </scripts>
    <styles>
      <source>main.css</source>
      <source>common.css</source>
    </styles>
  </dependencies>
</micro-application>

注意

• 在主 js 文件中需要导出 bootstrap、mount、unmount 三个生命周期钩子，以供主应用在适当的时机调用。
• 主 js 导出的模块需要挂载到 window 上，如果是 webpack 即需要把 output.target 设置为 window
• 如果子应用对 js 进行分包，需要配置其它 js chunk 的加载路径，webpack 为 __webpack_public_path__
• 子应用使用 webpack4 时需要配置 output.jsonpFunction 为唯一值
• 使用 create-pandora-app 创建子应用时模版内会内置上述配置，无需额外配置