Merge branch 'master' into release-stark-module-1.5.1

packages/icestark/src/AppRouter.tsx

@@ -43,7 +43,7 @@ interface AppRouterState {
   started: boolean;
 }
 
-export default class AppRouter extends React.Component<AppRouterProps, AppRouterState> {
+export default class AppRouter extends React.Component<React.PropsWithChildren<AppRouterProps>, AppRouterState> {
   static defaultProps = {
     onRouteChange: () => {},
     // eslint-disable-next-line react/jsx-filename-extension

website/docs/faq.md

@@ -119,7 +119,7 @@ module.exports = {
 
 ## Error: Invariant failed: You should not use `<withRouter(Navigation) />` outside a `<Router>`
 
-因为 jsx 嵌套层级的关系，在主应用的 Layout 里没法使用 react-router 提供的 API，比如 `withRouter`, `Link`, `useParams` 等，具体参考文档 [主应用中路由跳转](./guide/use-layout/react#主应用中路由跳转)。
+因为 jsx 嵌套层级的关系，在主应用的 Layout 里没法使用 react-router 提供的 API，比如 `withRouter`, `Link`, `useParams` 等，具体参考文档 [主应用中路由跳转](guide/use-layout/react#主应用中路由跳转)。
 
 ## 官方 Demo 如何启用 HashRouter
 
@@ -274,7 +274,7 @@ appHistory.push('/seller', true);
 
 2. 添加 `fetch` polyfill
 
-当 [`loadScriptMode`](./api/ice-stark#loadscriptmode) 为 `fetch` 时，icestark 会使用 `window.fetch` 获取微应用静态资源，因此还需要对 `fetch` 进行 polyfill。这里，我们推荐 [whatwg-fetch](https://github.com/github/fetch)。请确保在 icestark 之前引入该资源。
+当 [`loadScriptMode`](api/ice-stark#loadscriptmode) 为 `fetch` 时，icestark 会使用 `window.fetch` 获取微应用静态资源，因此还需要对 `fetch` 进行 polyfill。这里，我们推荐 [whatwg-fetch](https://github.com/github/fetch)。请确保在 icestark 之前引入该资源。
 
 ```js
 // 入口文件
@@ -301,7 +301,7 @@ proxy sandbox is not support by current browser
 
 ## 如何解决 Script Error
 
-“Script error.” 是一个常见错误，但由于该错误不提供完整的报错信息（错误堆栈），问题排查往往无从下手。icestark 的 [scriptAttributes](./api/ice-stark#scriptattributes) 参数支持为加载的 `<script />` 资源添加 `crossorigin="anonymous"` 来解决这个问题。具体可参考 [scriptAttributes](./api/ice-stark#scriptattributes)。
+“Script error.” 是一个常见错误，但由于该错误不提供完整的报错信息（错误堆栈），问题排查往往无从下手。icestark 的 [scriptAttributes](api/ice-stark#scriptattributes) 参数支持为加载的 `<script />` 资源添加 `crossorigin="anonymous"` 来解决这个问题。具体可参考 [scriptAttributes](api/ice-stark#scriptattributes)。
 
 :::tip
 想了解更多有关 Script Error 的问题，可以参考 <a href="https://help.aliyun.com/document_detail/88579.html">“Script error.”的产生原因和解决办法</a>
@@ -325,7 +325,7 @@ const Routes = () => {
 }
 ```
 
-这样，不会导致微应用正常加载，但微应用路由没有匹配成功时导致的页面空白，而会显示 404 页面。这样，我们能清晰地知道，在 icestark 执行环境下，需要修改[微应用的 basename](./guide/use-child/react#2-定义基准路由)，使得微应用可以与当前路由匹配上。
+这样，不会导致微应用正常加载，但微应用路由没有匹配成功时导致的页面空白，而会显示 404 页面。这样，我们能清晰地知道，在 icestark 执行环境下，需要修改[微应用的 basename](guide/use-child/react#2-定义基准路由)，使得微应用可以与当前路由匹配上。
 
 ## Vite 微应用支持沙箱吗
 
@@ -338,7 +338,7 @@ const Routes = () => {
 
 ## 切换微应用，主应用样式丢失
 
-通常情况是主应用开启了 webpack [Dynamic Imports](https://webpack.js.org/guides/code-splitting/#dynamic-imports) 能力，可以通过 [shouldAssetsRemove](./api/ice-stark#shouldassetsremove) 防止错误地移除主应用的样式资源。
+通常情况是主应用开启了 webpack [Dynamic Imports](https://webpack.js.org/guides/code-splitting/#dynamic-imports) 能力，可以通过 [shouldAssetsRemove](api/ice-stark#shouldassetsremove) 防止错误地移除主应用的样式资源。
 
 ```js
 // src/App.jsx
@@ -365,5 +365,5 @@ const App = () => {
 
 ## 主应用路由之间跳转导致重复渲染
 
-如果主应用需要包含路由页面，在 [React 主应用接入](./guide/use-layout/react#主应用中如何包含路由页面) 我们推荐将主应用路由作为一个 `fallback` 微应用来使用。但由于在主应用路由切换时，上层组件状态改变会导致 `fallback` 应用重复渲染，因此推荐使用 [React.memo](https://reactjs.org/docs/react-api.html#reactmemo) 防止 React 组件重复渲染。具体示例可参考 [主应用中如何包含路由页面](./guide/use-layout/react#主应用中如何包含路由页面)
+如果主应用需要包含路由页面，在 [React 主应用接入](guide/use-layout/react#主应用中如何包含路由页面) 我们推荐将主应用路由作为一个 `fallback` 微应用来使用。但由于在主应用路由切换时，上层组件状态改变会导致 `fallback` 应用重复渲染，因此推荐使用 [React.memo](https://reactjs.org/docs/react-api.html#reactmemo) 防止 React 组件重复渲染。具体示例可参考 [主应用中如何包含路由页面](guide/use-layout/react#主应用中如何包含路由页面)
 

website/docs/guide.md

@@ -15,7 +15,7 @@ icestark 在保证一个系统的操作体验基础上，实现各个微应用
 icestark 可以通过简单的命令行，生成主应用和微应用模板。无论您是使用 React 还是 Vue，都可以便捷的创建符合 icestark 微前端规范的项目。这些项目均由 icestark 团队官方维护。
 
 :::tip
-如果您想将正在开发中或已开发完成的项目接入 icestark，请移步[主应用接入](./guide/use-layout/react)和[微应用接入](./guide/use-child/react)。如果您使用的是 [create-react-app](https://github.com/facebook/create-react-app) 、umi 等框架开发的应用，亦可参考[其它框架的接入指南](./guide/use-child/others)。
+如果您想将正在开发中或已开发完成的项目接入 icestark，请移步[主应用接入](guide/use-layout/react)和[微应用接入](guide/use-child/react)。如果您使用的是 [create-react-app](https://github.com/facebook/create-react-app) 、umi 等框架开发的应用，亦可参考[其它框架的接入指南](guide/use-child/others)。
 :::
 
 ### 初始化主应用
@@ -49,5 +49,5 @@ $ npm run start
 + 现代浏览器和 IE11。
 
 :::tip
-对于 IE 系列浏览器，需要提供相应的 polyfill 支持。详细介绍，请参考[常见问题 -> 兼容 IE 浏览器](./faq#兼容-ie-浏览器)
+对于 IE 系列浏览器，需要提供相应的 polyfill 支持。详细介绍，请参考[常见问题 -> 兼容 IE 浏览器](faq#兼容-ie-浏览器)
 :::

website/docs/guide/advanced/performance.md

@@ -40,7 +40,7 @@ start({
 `prefetch` 值支持三种形式：
 
 + **布尔值**：当 `prefetch` 为 `true` 时，所以微应用资源均会被 `prefetch`;
-+ **数组**：当传入值为 `name` 的数组时，只要数组中的微应用资源会被 `prefetch`;
++ **数组**：当传入值为 `name` 的数组时，只有数组中的微应用资源会被 `prefetch`;
 
 ```js
 start({
@@ -238,7 +238,7 @@ const App = () => {
 
 ```js
 // webpack.config.js
-mmodule.exports = {
+module.exports = {
   // ...
   externals: {
     'react': 'React',

website/docs/guide/micro-module.md

@@ -182,7 +182,7 @@ export default function ExampleComponent(props) {
 
 ## 已有项目改造为微模块
 
-将已有项目改造为微模块的方式与 [微应用](./use-child/react) 类似，主要包含两步：
+将已有项目改造为微模块的方式与 [微应用](use-child/react) 类似，主要包含两步：
 
 #### 1. 应用入口导出生命周期函数
 
@@ -282,9 +282,10 @@ const moduleInfo = {
 const ModuleComponent = () => {
   const renderNode = useRef(null);
   useEffect(() => {
-    mountModule(moduleInfo, renderNode.current, {});
+    const dom = renderNode.current;
+    mountModule(moduleInfo, dom, {});
     return () => {
-      unmoutModule(moduleInfo, renderNode.current);
+      unmoutModule(moduleInfo, dom);
     }
   }, []);
   return (<div ref={renderNode}></div>);

website/docs/guide/use-child/others.md

@@ -8,7 +8,7 @@ order: 3
 为一些使用 [`icejs`](https://ice.work/) 、[`create-react-app`](https://github.com/facebook/create-react-app)、umi 等三方框架的用户提供便利的接入指南。
 
 :::tip
-如果这里找不到您使用的框架类型，建议您通过[微应用接入三步骤](./react#已有-react-项目改造为微应用)来改造您的应用。所有的改造逻辑都是相通的，也欢迎您提供 <a href="https://github.com/ice-lab/icestark/pulls">PR</a> 介绍您的接入经验。
+如果这里找不到您使用的框架类型，建议您通过[微应用接入三步骤](react#已有-react-项目改造为微应用)来改造您的应用。所有的改造逻辑都是相通的，也欢迎您提供 <a href="https://github.com/ice-lab/icestark/pulls">PR</a> 介绍您的接入经验。
 :::
 
 ## icejs 应用
@@ -546,7 +546,7 @@ export default defineConfig({
 
 ### 配置基准路由
 
-对于基准路由的配置，可以依照 [React 微应用接入](./react#2-%E5%AE%9A%E4%B9%89%E5%9F%BA%E5%87%86%E8%B7%AF%E7%94%B1) 和 [Vue 微应用接入](./vue#2-%E5%AE%9A%E4%B9%89%E5%9F%BA%E5%87%86%E8%B7%AF%E7%94%B1) 相同的方式改造接入。
+对于基准路由的配置，可以依照 [React 微应用接入](react#2-%E5%AE%9A%E4%B9%89%E5%9F%BA%E5%87%86%E8%B7%AF%E7%94%B1) 和 [Vue 微应用接入](vue#2-%E5%AE%9A%E4%B9%89%E5%9F%BA%E5%87%86%E8%B7%AF%E7%94%B1) 相同的方式改造接入。
 
 ### 主应用加载 Vite 应用
 

website/docs/guide/use-layout/react.md

@@ -4,7 +4,7 @@
 
 ## 通过官方脚手架创建
 
-> 该官方脚手架基于 [icejs](https://ice.work/) 框架，如需使用其他框架/工程可按 [已有应用改造](./react#已有应用改造) 的方式接入。
+> 该官方脚手架基于 [icejs](https://ice.work/) 框架，如需使用其他框架/工程可按 [已有应用改造](react#已有应用改造) 的方式接入。
 
 ```bash
 $ npm init ice icestark-layout @icedesign/stark-layout-scaffold

website/docs/guide/use-layout/vue.md

@@ -4,7 +4,7 @@
 
 ## 通过官方脚手架创建
 
-> 该官方脚手架基于 Vue 2.0 + Vue CLI，如需使用其他框架/工程可按 [已有应用改造](./vue#已有应用改造) 的方式接入。
+> 该官方脚手架基于 Vue 2.0 + Vue CLI，如需使用其他框架/工程可按 [已有应用改造](vue#已有应用改造) 的方式接入。
 > 需注意，目前 @vue-materials/icestark-layout-app 1.x 采用 Vite + icestark + vue3 框架应用。
 
 ```bash

website/package.json

@@ -40,7 +40,7 @@
   "devDependencies": {
     "@easyops-cn/docusaurus-search-local": "^0.17.0",
     "@iceworks/spec": "^1.3.2",
-    "axios": "^0.21.2",
+    "axios": "^1.6.0",
     "fs-extra": "^10.0.0",
     "glob": "^7.1.7",
     "gray-matter": "^4.0.3",