说明

MPA 支持是非常麻烦的一件事情, 单页面只要返回一个 index.html 即可.

对于多页面应用程序构建后的目录结构各不相同所以无法向 SPA 那样简单.

针对输出的复杂程度, 这里设计了几种不同的方式来支持 MPA 托管.

实现

第一阶段将支持 mfe-route.json 中配置 rewrites 的形式.

mfe-proxy-server 将会读取 rewrites 来进行处理.

对于所有构建目录下扩展名称是 HTML 的文件, 如果文件名称使用下划线开头:

_home.html
_user.html
_shop.html

则会自动生成对应的路由规则:

/home/*
/user/*
/shop/*

如果在两个单词间使用下划线:

_home_about.html
_user_password.html

则将会以下列路由进行匹配:

/home/about/*
/user/password/*

如果文件结尾使用下划线:

_home_.html
_home_about_.html

则将会以下列路由进行匹配, 即精确匹配:

/home
/home/about

此外如果存在 index.html 依然会按照预期的方式进行工作.

在项目打包完成后, 在项目路径下执行:

npx mfe-proxy-cli generate route

mfe-proxy-cli 将会:

第三阶段则允许 mfe-route.json 以 JavaScript 的形式定义在 mfe-config.js 中, mfe-config.js (所使用的 javascript 规范目前还未定义).

这样 mfe-route.js 中所定义的 domain 和 rewrites 可以直接被项目所依赖, 同样的配置不再需要被配置两次.

当执行:

npx mfe-proxy-cli generate route

逻辑如下: