Skip to content

Commit

Permalink
deploy: 6e64e7d
Browse files Browse the repository at this point in the history
  • Loading branch information
bailicangdu committed Apr 29, 2024
1 parent 0177db6 commit bc56018
Show file tree
Hide file tree
Showing 16 changed files with 249 additions and 87 deletions.
24 changes: 14 additions & 10 deletions zh-cn/api.md
Original file line number Diff line number Diff line change
Expand Up @@ -233,7 +233,7 @@ import { removeDomScope } from '@micro-zoe/micro-app'
// 解除元素绑定
removeDomScope()

// 解除元素绑定,并且一定时间内阻止再次绑定
// 解除元素绑定,并且一定时间内阻止再次绑定(一个微任务Promise时间)
removeDomScope(true)
```

Expand Down Expand Up @@ -267,17 +267,19 @@ function unmountApp(appName: string, options?: unmountAppParams): Promise<boolea

**使用方式:**
```js
import microApp from '@micro-zoe/micro-app'

// 正常流程
unmountApp(子应用名称).then(() => console.log('卸载成功'))
microApp.unmountApp(子应用名称).then(() => console.log('卸载成功'))

// 卸载应用并清空缓存资源
unmountApp(子应用名称, { destroy: true }).then(() => console.log('卸载成功'))
microApp.unmountApp(子应用名称, { destroy: true }).then(() => console.log('卸载成功'))

// 如果子应用是keep-alive应用,则卸载并清空状态,如果子应用不是keep-alive应用,则正常卸载
unmountApp(子应用名称, { clearAliveState: true }).then(() => console.log('卸载成功'))
microApp.unmountApp(子应用名称, { clearAliveState: true }).then(() => console.log('卸载成功'))

// 如果destroy和clearAliveState同时为true,则clearAliveState将失效
unmountApp(子应用名称, { destroy: true, clearAliveState: true }).then(() => console.log('卸载成功'))
microApp.unmountApp(子应用名称, { destroy: true, clearAliveState: true }).then(() => console.log('卸载成功'))
```

## unmountAllApps
Expand Down Expand Up @@ -309,17 +311,19 @@ function unmountAllApps(options?: unmountAppParams): Promise<boolean>

**使用方式:**
```js
import microApp from '@micro-zoe/micro-app'

// 正常流程
unmountAllApps().then(() => console.log('卸载成功'))
microApp.unmountAllApps().then(() => console.log('卸载成功'))

// 卸载所有应用并清空缓存资源
unmountAllApps({ destroy: true }).then(() => console.log('卸载成功'))
microApp.unmountAllApps({ destroy: true }).then(() => console.log('卸载成功'))

// 如果子应用是keep-alive应用,则卸载并清空状态,如果子应用不是keep-alive应用,则正常卸载
unmountAllApps({ clearAliveState: true }).then(() => console.log('卸载成功'))
microApp.unmountAllApps({ clearAliveState: true }).then(() => console.log('卸载成功'))

// 如果destroy和clearAliveState同时为true,则clearAliveState将失效
unmountAllApps({ destroy: true, clearAliveState: true }).then(() => console.log('卸载成功'))
microApp.unmountAllApps({ destroy: true, clearAliveState: true }).then(() => console.log('卸载成功'))
```


Expand Down Expand Up @@ -649,7 +653,7 @@ function removeDomScope(force?: boolean): void
// 解除元素绑定
window.microApp.removeDomScope()

// 解除元素绑定,并且一定时间内阻止再次绑定
// 解除元素绑定,并且一定时间内阻止再次绑定(一个微任务Promise时间)
window.microApp.removeDomScope(true)
```

Expand Down
31 changes: 30 additions & 1 deletion zh-cn/changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,35 @@

---

### 1.0.0-rc.5

`2024-4-29`

- **New**

- 🆕 新增虚拟路由系统`state`模式,用于适配更多使用场景。

- **Bug Fix**

- 🐞 修复了iframe沙箱下`unhandledrejection`事件失效的问题,[issue 1102](https://github.com/micro-zoe/micro-app/issues/1102)[issue 1159](https://github.com/micro-zoe/micro-app/issues/1159)
- 🐞 修复了with沙箱下`keep-alive`子应用二次渲染后无法通过`microApp.router`控制跳转的问题,[issue 1115](https://github.com/micro-zoe/micro-app/issues/1115)
- 🐞 修复了with沙箱下预渲染子应用路由跳转异常的问题。
- 🐞 修复了native路由模式下,主应用和子应用都是vue-router@4导致浏览器前进后退路由地址混乱的问题。
- 🐞 修复了设置`disable-memory-router`后,部分场景下子应用内部跳转失败的问题,[issue 1132](https://github.com/micro-zoe/micro-app/issues/1132)
- 🐞 修复了iframe沙箱下`Aliplayer`视频播放器无法正常运行的问题。
- 🐞 修复了`native``disable-memory-router`路由模式下,主应用、子应用都是vue3导致路由冲突导航异常的问题,[issue 1148](https://github.com/micro-zoe/micro-app/issues/1148)[issue 1132](https://github.com/micro-zoe/micro-app/issues/1132)
- 🐞 修复了格式化子应用url导致部分场景下路由匹配异常的问题,[issue 1147](https://github.com/micro-zoe/micro-app/issues/1147)
- 🐞 修复了with沙箱下生命周期`mounted`, `unmount`重复触发的问题,[issue 1161](https://github.com/micro-zoe/micro-app/issues/1161)
- 🐞 修复了域名中包含.js导致子应用渲染失败的问题,[issue 1172](https://github.com/micro-zoe/micro-app/issues/1172)[PR 1173](https://github.com/micro-zoe/micro-app/pull/1173) by [SepVeneto](https://github.com/SepVeneto)
- 🐞 修复了iframe沙箱下子应用设置`history.scrollRestoration`不生效的问题。
- 🐞 修复了虚拟路由系统pure模式下,通过location进行跳转表现异常的问题,[issue 1135](https://github.com/micro-zoe/micro-app/issues/1135)

- **Update**

- 🚀 优化了生命周期全局监听函数的传递参数。
- 🚀 更新了路由相关文档。


### 1.0.0-rc.4

`2024-1-31`
Expand All @@ -31,7 +60,7 @@
- 🐞 修复了with沙箱子应用的`window.onpopstate`兜底到主应用导致多次执行的问题。
- 🐞 修复了craco子应用style元素插入顺序错误导致样式优先级混乱的问题,[issue 1071](https://github.com/micro-zoe/micro-app/issues/1071)
- 🐞 修复了在部分场景下子应用重写`Array.prototype.includes`导致死循环的问题,[PR 1067](https://github.com/micro-zoe/micro-app/pull/1067) by [tinymins](https://github.com/tinymins)
- 🐞 修复了在关闭虚拟路由系统时子应用域名与浏览器域名不一致的问题。
- 🐞 修复了在关闭虚拟路由系统时子应用域名与浏览器域名不一致的问题[issue 937](https://github.com/micro-zoe/micro-app/issues/937)

- **Update**
- 🚀 虚拟路由系统升级,新增`search``native``native-scope``pure`模式,用于适配更多使用场景。
Expand Down
2 changes: 1 addition & 1 deletion zh-cn/configure.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ MicroApp会根据url地址自动补全子应用的静态资源,如js、css、
## iframe
- Desc: `开启iframe沙箱`
- Default: `false`
- 使用方式: `<micro-app iframe></micro-app>`
- 使用方式: `<micro-app name='xx' url='xx' iframe></micro-app>`

MicroApp有两种沙箱方案:`with沙箱``iframe沙箱`

Expand Down
8 changes: 4 additions & 4 deletions zh-cn/dom-scope.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,8 @@
```js
import { removeDomScope } from '@micro-zoe/micro-app'

// 解除元素绑定,并且一定时间内(一个微任务Promise时间)阻止再次绑定
removeDomScope(true)
// 解除元素绑定,并且一定时间内阻止再次绑定(一个微任务Promise时间)
removeDomScope(true) // 或者 removeDomScope()

const div = window.document.createElement('div')
// 插入到主应用body中
Expand All @@ -33,8 +33,8 @@ document.body.appendChild(div)

#### ** 子应用 **
```js
// 解除元素绑定,并且一定时间内(一个微任务Promise时间)阻止再次绑定
window.microApp.removeDomScope(true)
// 解除元素绑定,并且一定时间内阻止再次绑定(一个微任务Promise时间)
window.microApp.removeDomScope(true) // 或者 window.microApp.removeDomScope()

const div = window.rawDocument.createElement('div')
// 插入到主应用body中
Expand Down
2 changes: 1 addition & 1 deletion zh-cn/env.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ import './public-path'

**描述:子应用的基础路由**

详情见[路由-基础路由](/zh-cn/browser-router?id=基础路由)一章。
详情见[路由-基础路由](/zh-cn/native-mode?id=基础路由)一章。

### `__MICRO_APP_BASE_APPLICATION__`

Expand Down
2 changes: 1 addition & 1 deletion zh-cn/framework/angular.md
Original file line number Diff line number Diff line change
Expand Up @@ -182,7 +182,7 @@ module.exports = {
#### 3、设置 publicPath
如果子应用出现静态资源地址404(js、css、图片),建议设置`publicPath`来尝试解决这个问题。

`publicPath`是webpack提供的功能,它可以补全静态资源的地址,详情参考webpack文档 [publicPath](https://webpack.docschina.org/guides/public-path/#on-the-fly)
`publicPath`是webpack提供的功能,所以vite应用是不支持的,它可以补全静态资源的地址,详情参考webpack文档 [publicPath](https://webpack.docschina.org/guides/public-path/#on-the-fly)

**步骤1:** 在子应用src目录下创建名称为`public-path.ts`的文件,并添加如下内容
```js
Expand Down
2 changes: 1 addition & 1 deletion zh-cn/framework/react.md
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ module.exports = {
#### 3、设置 publicPath
如果子应用出现静态资源地址404(js、css、图片),建议设置`publicPath`来尝试解决这个问题。

`publicPath`是webpack提供的功能,它可以补全静态资源的地址,详情参考webpack文档 [publicPath](https://webpack.docschina.org/guides/public-path/#on-the-fly)
`publicPath`是webpack提供的功能,所以vite应用是不支持的,它可以补全静态资源的地址,详情参考webpack文档 [publicPath](https://webpack.docschina.org/guides/public-path/#on-the-fly)

**步骤1:** 在子应用src目录下创建名称为`public-path.js`的文件,并添加如下内容
```js
Expand Down
6 changes: 6 additions & 0 deletions zh-cn/framework/vite.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,3 +28,9 @@ window.microApp.location.href = 'xxx'
window.microApp.location.pathname = 'xxx'
```

#### 2、iframe沙箱加载了主应用的资源

**解决方式:**在主应用head最前面插入下面js
```html
<script>if(window.parent !== window) {window.stop()}</script>
```
31 changes: 25 additions & 6 deletions zh-cn/framework/vue.md
Original file line number Diff line number Diff line change
Expand Up @@ -224,7 +224,7 @@ module.exports = {
#### 3、设置 publicPath
如果子应用出现静态资源地址404(js、css、图片),建议设置`publicPath`来尝试解决这个问题。

`publicPath`是webpack提供的功能,它可以补全静态资源的地址,详情参考webpack文档 [publicPath](https://webpack.docschina.org/guides/public-path/#on-the-fly)
`publicPath`是webpack提供的功能,所以vite应用是不支持的,它可以补全静态资源的地址,详情参考webpack文档 [publicPath](https://webpack.docschina.org/guides/public-path/#on-the-fly)

**步骤1:** 在子应用src目录下创建名称为`public-path.js`的文件,并添加如下内容
```js
Expand Down Expand Up @@ -311,13 +311,32 @@ export default defineConfig({
```
<!-- tabs:end -->

<!-- #### 2、子应用中element-plus部分弹框样式失效
#### 2、虚拟路由系统为search模式时主应用循环刷新

**原因:**element-plus中部分组件,如`Select`, `TimePicker`的弹框元素会脱离micro-app的范围逃逸到外层body上,导致样式失效。
**解决方式**将router-view或者包含微前端的上层组件中`:key="route.fullPath"`改为`:key="route.path"`或者`:key="route.name"`

**解决方式:**
**例如**

1、关闭样式隔离[disablescopecss](/zh-cn/configure?id=disablescopecss)
```html
<!-- bad 😭 -->
<router-view v-slot="{ Component, route }">
<transition name="fade">
<component :is="Component" :key="route.fullPath" />
</transition>
</router-view>

<!-- good 😊 -->
<router-view v-slot="{ Component, route }">
<transition name="fade">
<component :is="Component" :key="route.path" />
</transition>
</router-view>
```

2、部分组件,如`Select`提供了`popper-append-to-body`配置,用于设置弹框不插入body,可以避免这个问题。如果组件没有提供类似的功能,则暂且只能通过关闭样式隔离解决。 -->
```html
<!-- bad 😭 -->
<router-view :key="$route.fullPath"></router-view>

<!-- good 😊 -->
<router-view :key="$route.path"></router-view>
```
30 changes: 15 additions & 15 deletions zh-cn/life-cycles.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
子应用卸载时触发。

#### 5. error
子应用渲染出错时触发,只有会导致渲染终止的错误才会触发此生命周期。
子应用加载出错时触发,只有会导致渲染终止的错误才会触发此生命周期。


## 监听生命周期
Expand All @@ -37,10 +37,10 @@ import jsxCustomEvent from '@micro-zoe/micro-app/polyfill/jsx-custom-event'
name='xx'
url='xx'
onCreated={() => console.log('micro-app元素被创建')}
onBeforemount={() => console.log('即将被渲染')}
onBeforemount={() => console.log('即将渲染')}
onMounted={() => console.log('已经渲染完成')}
onUnmount={() => console.log('已经卸载')}
onError={() => console.log('渲染出错')}
onError={() => console.log('加载出错')}
/>
```

Expand All @@ -66,7 +66,7 @@ export default {
console.log('micro-app元素被创建')
},
beforemount () {
console.log('即将被渲染')
console.log('即将渲染')
},
mounted () {
console.log('已经渲染完成')
Expand All @@ -75,7 +75,7 @@ export default {
console.log('已经卸载')
},
error () {
console.log('渲染出错')
console.log('加载出错')
}
}
}
Expand Down Expand Up @@ -117,20 +117,20 @@ import microApp from '@micro-zoe/micro-app'

microApp.start({
lifeCycles: {
created (e) {
console.log('created')
created (e, appName) {
console.log(`子应用${appName}被创建`)
},
beforemount (e) {
console.log('beforemount')
beforemount (e, appName) {
console.log(`子应用${appName}即将渲染`)
},
mounted (e) {
console.log('mounted')
mounted (e, appName) {
console.log(`子应用${appName}已经渲染完成`)
},
unmount (e) {
console.log('unmount')
unmount (e, appName) {
console.log(`子应用${appName}已经卸载`)
},
error (e) {
console.log('error')
error (e, appName) {
console.log(`子应用${appName}加载出错`)
}
}
})
Expand Down
Loading

0 comments on commit bc56018

Please sign in to comment.