简介

module-federation-override 是一个浏览器工具，在使用 MF 开发微前端项目时，能够动态的去替换子应用的地址，这允许开发人员在应用开发期间覆盖单个应用以指向其本地主机，而无需启动包含所有其他应用和后端服务器的本地环境，这样的话开发人员可以在已部署的环境中进行开发和调试，而不必启动本地环境。

使用教程

• 在基座的html文件中引入开发工具

// Make sure to put this BEFORE any <script type="overridable-modulemap"> elements
<script
  type="text/javascript"
  src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.js"
></script>
// The full UI, including the "trigger" button that pops up the UI.
<module-federation-overrides-full></module-federation-overrides-full>

• 在基座的html添加所有子应用的 MF 配置信息

<script type="overridable-modulemap">
    [
        {
            "name": "project1",
            "url": "http://11.138.49.21:8156//remoteEntry.js"
        },
        {
            "name": "project2",
            "url": "http://localhost:5000/remoteEntry.js"
        }
    ]
</script>

开发测试

• 安装依赖

pnpm i

• 打包

pnpm build

• 启动服务

pnpm serve-test