⬆️ upgrade dumi to 2.x

.dumirc.ts

@@ -0,0 +1,60 @@
+import { defineConfig } from 'dumi';
+
+export default defineConfig({
+  ssr: {},
+  publicPath: process.env.NOW_DEPLOY ? '/' : '/qiankun/',
+  base: process.env.NOW_DEPLOY ? '/' : '/qiankun',
+  resolve: {
+    docDirs: ['docs'],
+    codeBlockMode: 'passive',
+  },
+  locales: [
+    { id: 'en', name: 'English' },
+    { id: 'zh-CN', name: '中文' },
+  ],
+  themeConfig: {
+    logo: 'https://gw.alipayobjects.com/zos/bmw-prod/8a74c1d3-16f3-4719-be63-15e467a68a24/km0cv8vn_w500_h500.png',
+    nav: {
+      mode: 'append',
+      value: {
+        'zh-CN': [
+          {
+            title: '版本公告',
+            children: [
+              { title: '发布日志', link: 'https://github.com/umijs/qiankun/releases' },
+              { title: '升级指南', link: '/zh/cookbook#从-1x-版本升级到-2x-版本' },
+              { title: '1.x 版本', link: 'https://v1.qiankun.umijs.org/zh/' },
+            ],
+          },
+          { title: 'GitHub', link: 'https://github.com/umijs/qiankun' },
+        ],
+        en: [
+          {
+            title: 'Version Notice',
+            children: [
+              { title: 'Changelog', link: 'https://github.com/umijs/qiankun/releases' },
+              { title: 'Upgrade Guide', link: '/cookbook#upgrade-from-1x-version-to-2x-version' },
+              { title: '1.x Version', link: 'https://v1.qiankun.umijs.org/' },
+            ],
+          },
+          { title: 'GitHub', link: 'https://github.com/umijs/qiankun' },
+        ],
+      },
+    },
+  },
+  metas: [
+    {
+      name: 'keywords',
+      content:
+        'microfrontend, micro frontend, micro frontends, micro-frontend, micro-frontends, microservice, javascript',
+    },
+  ],
+  analytics: {
+    ga: 'UA-157295698-1',
+    baidu: '0f738d9b0ac90574c09183ea85bcfa2e',
+  },
+  favicons: ['https://gw.alipayobjects.com/mdn/rms_655822/afts/img/A*4sIUQpcos_gAAAAAAAAAAAAAARQnAQ'],
+  theme: {
+    '@c-primary': '#6451AB',
+  },
+});

.gitignore

@@ -21,3 +21,6 @@ package-lock.json
 .now
 .pnpm-store
 *.log
+.dumi/tmp
+.dumi/tmp-test
+.dumi/tmp-production

docs/api/README.md

@@ -213,11 +213,11 @@ By linking the micro-application to some url rules, the function of automaticall
 
 It is suitable for scenarios where a micro application needs to be manually loaded / unloaded.
 
-<Alert type="info">
+:::info
 Usually in this scenario, the micro application is a business component that can run independently without routing.
 Micro applications should not be split too fine, it is recommended to split according to the business domain. Functional units with close business associations should be made into one micro-application, and conversely, those with less close association can be considered to be split into multiple micro-applications.
 A criterion for judging whether the business is closely related: <strong>Look at whether this micro application has frequent communication needs with other micro applications</strong>. If it is possible to show that these two micro-applications are serving the same business scenario, it may be more appropriate to merge them into one micro-application.
-</Alert>
+:::
 
 ### `loadMicroApp(app, configuration?)`
 

docs/api/README.zh.md → docs/api/README.zh-CN.md

@@ -136,9 +136,9 @@ toc: menu
 
       默认情况下沙箱可以确保单实例场景子应用之间的样式隔离，但是无法确保主应用跟子应用、或者多实例场景的子应用样式隔离。当配置为 `{ strictStyleIsolation: true }` 时表示开启严格的样式隔离模式。这种模式下 qiankun 会为每个微应用的容器包裹上一个 [shadow dom](https://developer.mozilla.org/zh-CN/docs/Web/Web_Components/Using_shadow_DOM) 节点，从而确保微应用的样式不会对全局造成影响。
 
-      <Alert>
-        基于 ShadowDOM 的严格样式隔离并不是一个可以无脑使用的方案，大部分情况下都需要接入应用做一些适配后才能正常在 ShadowDOM 中运行起来（比如 react 场景下需要解决这些 <a target="_blank" href="https://github.com/facebook/react/issues/10422">问题</a>，使用者需要清楚开启了 <code>strictStyleIsolation</code> 意味着什么。后续 qiankun 会提供更多官方实践文档帮助用户能快速的将应用改造成可以运行在 ShadowDOM 环境的微应用。
-      </Alert>
+      :::warning
+      基于 ShadowDOM 的严格样式隔离并不是一个可以无脑使用的方案，大部分情况下都需要接入应用做一些适配后才能正常在 ShadowDOM 中运行起来（比如 react 场景下需要解决这些 <a target="_blank" href="https://github.com/facebook/react/issues/10422">问题</a>，使用者需要清楚开启了 <code>strictStyleIsolation</code> 意味着什么。后续 qiankun 会提供更多官方实践文档帮助用户能快速的将应用改造成可以运行在 ShadowDOM 环境的微应用。
+      :::
 
       除此以外，qiankun 还提供了一个实验性的样式隔离特性，当 experimentalStyleIsolation 被设置为 true 时，qiankun 会改写子应用所添加的样式为所有样式规则增加一个特殊的选择器规则来限定其影响范围，因此改写后的代码会表达类似为如下结构：
 
@@ -217,11 +217,11 @@ toc: menu
 
 适用于需要手动 加载/卸载 一个微应用的场景。
 
-<Alert type="info">
+:::info
 通常这种场景下微应用是一个不带路由的可独立运行的业务组件。
 微应用不宜拆分过细，建议按照业务域来做拆分。业务关联紧密的功能单元应该做成一个微应用，反之关联不紧密的可以考虑拆分成多个微应用。
 一个判断业务关联是否紧密的标准：<strong>看这个微应用与其他微应用是否有频繁的通信需求</strong>。如果有可能说明这两个微应用本身就是服务于同一个业务场景，合并成一个微应用可能会更合适。
-</Alert>
+:::
 
 ### `loadMicroApp(app, configuration?)`
 
@@ -240,9 +240,9 @@ toc: menu
 
       默认情况下沙箱可以确保单实例场景子应用之间的样式隔离，但是无法确保主应用跟子应用、或者多实例场景的子应用样式隔离。当配置为 `{ strictStyleIsolation: true }` 时表示开启严格的样式隔离模式。这种模式下 qiankun 会为每个微应用的容器包裹上一个 [shadow dom](https://developer.mozilla.org/zh-CN/docs/Web/Web_Components/Using_shadow_DOM) 节点，从而确保微应用的样式不会对全局造成影响。
 
-      <Alert>
-        基于 ShadowDOM 的严格样式隔离并不是一个可以无脑使用的方案，大部分情况下都需要接入应用做一些适配后才能正常在 ShadowDOM 中运行起来（比如 react 场景下需要解决这些 <a target="_blank" href="https://github.com/facebook/react/issues/10422">问题</a>，使用者需要清楚开启了 <code>strictStyleIsolation</code> 意味着什么。后续 qiankun 会提供更多官方实践文档帮助用户能快速的将应用改造成可以运行在 ShadowDOM 环境的微应用。
-      </Alert>
+      :::warning
+      基于 ShadowDOM 的严格样式隔离并不是一个可以无脑使用的方案，大部分情况下都需要接入应用做一些适配后才能正常在 ShadowDOM 中运行起来（比如 react 场景下需要解决这些 <a target="_blank" href="https://github.com/facebook/react/issues/10422">问题</a>，使用者需要清楚开启了 <code>strictStyleIsolation</code> 意味着什么。后续 qiankun 会提供更多官方实践文档帮助用户能快速的将应用改造成可以运行在 ShadowDOM 环境的微应用。
+      :::
 
       除此以外，qiankun 还提供了一个实验性的样式隔离特性，当 experimentalStyleIsolation 被设置为 true 时，qiankun 会改写子应用所添加的样式为所有样式规则增加一个特殊的选择器规则来限定其影响范围，因此改写后的代码会表达类似为如下结构：
 

docs/faq/README.md

@@ -263,9 +263,9 @@ __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
 
 For more details, check the [webpack doc](https://webpack.js.org/guides/public-path/#on-the-fly).
 
-<Alert type="info">
+:::info
 Runtime publicPath addresses the problem of incorrect scripts, styles, images, and other addresses for dynamically loaded in sub application.
-</Alert>
+:::
 
 ### 2. With webpack static public path config
 
@@ -599,10 +599,10 @@ Example for antd：
 
 Detailed documentation pls check [antd official guide](https://ant.design/docs/react/customize-theme).
 
-<Alert type="info">
+:::info
 In the latest version, you can also try to config ` {sandbox: {experimentalStyleIsolation: true}} ` to open the runtime scoped CSS feature, thus solving the problem of the style of the isolation between applications.
 PS: Currently, this feature is still in the experimental stage, if encounter some problems please submit an <a href="https://github.com/umijs/qiankun/issues/new?assignees=&labels=&template=bug_report.md&title=" target="_blank">issue</a> to help us improve together.
-</Alert>
+:::
 
 ## How to make sub app to run independently?
 
@@ -633,9 +633,9 @@ start({ singular: false });
 
 After setting `singular: false` in `start` method, `reactApp` and `react15App` should be active at the same time once `isReactApp` method returns `true`.
 
-<Alert>
+:::warning
 Notice that no more than one application that relies on router can be displayed on the page at the same time, as the browser has only one url location, if there is more than one routing apps, it will definitely result in one of them to be 404 found.
-</Alert>
+:::
 
 ## How to extract the common library？
 
@@ -657,9 +657,9 @@ You can find the singular usage [here](/api#startopts).
 
 If you want qiankun (or its dependent libraries, or your own application) to work properly in IE, you need to introduce the following polyfills at the portal **at least**:
 
-<Alert type="info">
+:::info
 What's <a href="https://developer.mozilla.org/en-US/docs/Glossary/Polyfill" target="_blank">polyfill</a>
-</Alert>
+:::
 
 ```javascript
 import 'whatwg-fetch';

docs/faq/README.zh.md → docs/faq/README.zh-CN.md

@@ -265,9 +265,9 @@ __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
 
 关于运行时 publicPath 的技术细节，可以参考 [webpack 文档](https://webpack.js.org/guides/public-path/#on-the-fly)。
 
-<Alert type="info">
+:::info
 runtime publicPath 主要解决的是微应用动态载入的 脚本、样式、图片 等地址不正确的问题。
-</Alert>
+:::
 
 ### b. 使用 webpack 静态 publicPath 配置
 
@@ -603,10 +603,10 @@ qiankun 将会自动隔离微应用之间的样式（开启沙箱的情况下）
 
 详细文档参考 [antd 官方指南](https://ant.design/docs/react/customize-theme)。
 
-<Alert type="info">
+:::info
 在最新的 qiankun 版本中，你也可以尝试通过配置 `{ sandbox : { experimentalStyleIsolation: true } }` 的方式开启运行时的 scoped css 功能，从而解决应用间的样式隔离问题。
 PS：目前该特性还处于实验阶段，如果碰到一些问题欢迎提 <a href="https://github.com/umijs/qiankun/issues/new?assignees=&labels=&template=bug_report_cn.md&title=%5BBug%5D%E8%AF%B7%E9%81%B5%E5%BE%AA%E4%B8%8B%E6%96%87%E6%A8%A1%E6%9D%BF%E6%8F%90%E4%BA%A4%E9%97%AE%E9%A2%98%EF%BC%8C%E5%90%A6%E5%88%99%E6%82%A8%E7%9A%84%E9%97%AE%E9%A2%98%E4%BC%9A%E8%A2%AB%E5%85%B3%E9%97%AD" target="_blank">issue</a> 来帮助我们一起改善。
-</Alert>
+:::
 
 ## 如何独立运行微应用？
 
@@ -636,9 +636,9 @@ start({ singular: false });
 
 当在 `start` 方法中配置好 `singular: false` 后，只要 `isReactApp()` 返回 `true` 时，`reactApp` 和 `react15App` 将会同时被 mount。
 
-<Alert>
+:::warning
 页面上不能同时显示多个依赖于路由的微应用，因为浏览器只有一个 url，如果有多个依赖路由的微应用同时被激活，那么必定会导致其中一个 404。
-</Alert>
+:::
 
 ## 如何提取出公共的依赖库？
 
@@ -660,9 +660,9 @@ qiankun 2.0 版本将提供一种更智能的方式使其自动化。
 
 如果希望 qiankun （或其依赖库、或者您的应用本身）在 IE 下正常运行，你**至少**需要在应用入口引入以下这些 polyfills：
 
-<Alert type="info">
+:::info
 什么是 <a href="https://developer.mozilla.org/zh-CN/docs/Glossary/Polyfill" target="_blank">polyfill</a>
-</Alert>
+:::
 
 ```javascript
 import 'whatwg-fetch';
@@ -675,9 +675,9 @@ import 'core-js/web/url';
 
 **通常我们建议您直接使用 @babel/preset-env 插件完成自动引入 IE 需要的 polyfill 的能力，所有的操作文档您都可以在 [babel 官方文档](https://babeljs.io/docs/en/babel-preset-env) 找到。**
 
-<Alert type="info">
+:::info
 您也可以查看<a href="https://www.yuque.com/kuitos/gky7yw/qskte2" target="_blank">这篇文章</a>来获取更多 IE 兼容相关的知识。
-</Alert>
+:::
 
 ## 报错 `Here is no "fetch" on the window env, you need to polyfill it`
 

docs/guide/tutorial.md

@@ -51,9 +51,9 @@ Micro apps are divided into projects with `webpack` and without `webpack`. The t
 
 1. Added `public-path.js` file, used to modify the runtime `publicPath`.[What is publicPath at runtime?](https://webpack.js.org/guides/public-path/#on-the-fly).
 
-<Alert>
+:::warning
 Note: `publicPath` at runtime and `publicPath` at build time are different, and the two cannot be equivalently substituted.
-</Alert>
+:::
 
 2. It is recommended to use the route of the `history` mode for the micro app. The route `base` needs to be set, and the value is the same as its `activeRule`.
 3. Import `public-path.js` at the top of the entry file, modify and export three `lifecycles` functions.

docs/guide/tutorial.zh.md → docs/guide/tutorial.zh-CN.md

@@ -51,9 +51,9 @@ start();
 
 1. 新增 `public-path.js` 文件，用于修改运行时的 `publicPath`。[什么是运行时的 publicPath ？](https://webpack.docschina.org/guides/public-path/#on-the-fly)。
 
-<Alert>
+:::warning
 注意：运行时的 publicPath 和构建时的 publicPath 是不同的，两者不能等价替代。
-</Alert>
+:::
 
 2. 微应用建议使用 `history` 模式的路由，需要设置路由 `base`，值和它的 `activeRule` 是一样的。
 3. 在入口文件最顶部引入 `public-path.js`，修改并导出三个生命周期函数。

package.json

@@ -2,7 +2,7 @@
   "name": "qiankun-monorepo",
   "private": true,
   "engines": {
-    "node": "16"
+    "node": ">=16"
   },
   "scripts": {
     "dev": "pnpm run build && npm run start:main && npm run start:react15",
@@ -19,7 +19,7 @@
     "ci": "pnpm run lint && pnpm run prettier:check && pnpm run build",
     "ci:publish": "pnpm run build && changeset publish",
     "test": "pnpm -r run test",
-    "prepare": "husky install"
+    "prepare": "husky install && dumi setup"
   },
   "devDependencies": {
     "@changesets/cli": "^2.26.1",
@@ -29,8 +29,7 @@
     "@typescript-eslint/parser": "^6.3.0",
     "babel-plugin-import": "^1.12.1",
     "cross-env": "^7.0.2",
-    "dumi": "^1.1.0-beta.24",
-    "dumi-theme-default": "^1.0.10",
+    "dumi": "^2.2.12",
     "eslint": "^8.46.0",
     "eslint-config-prettier": "^9.0.0",
     "father": "^4.3.1",