Merge branch 'master' into fix-movable-position

Author: hiyuki

docs-vitepress/.vitepress/config.ts

@@ -18,7 +18,7 @@ const sidebar = {
                 { text: "快速开始", link: "/guide/basic/start" },
                 { text: "介绍", link: "/guide/basic/intro" },
                 { text: "单文件开发", link: "/guide/basic/single-file" },
-                { text: "IDE 高亮配置", link: "/guide/basic/ide" },
+                { text: "IDE 支持", link: "/guide/basic/ide" },
                 { text: "模板语法", link: "/guide/basic/template" },
                 { text: "CSS 处理", link: "/guide/basic/css" },
                 { text: "数据响应", link: "/guide/basic/reactive" },

docs-vitepress/api/app-config.md

@@ -158,7 +158,7 @@ mpx.config.webRouteConfig = {
 ```
 
 ## webConfig
-web 环境下的一些配置，如路由模式，页面切换动画效果等
+web 环境下的一些配置，如路由模式
 
 - **用法**:
 ```js
@@ -169,3 +169,4 @@ mpx.config.webConfig.routeConfig = {
 // 禁用页面切换动画
 mpx.config.webConfig.disablePageTransition = true
 ```
+此处的 `disablePageTransition` 后续将被废弃，请使用编译阶段的[disablePageTransition](./compile.md#webconfig)进行配置

docs-vitepress/api/compile.md

@@ -824,8 +824,17 @@ module.exports = defineConfig({
 
 transRpxFn 配置用于自定义输出 web 时对于 rpx 样式单位的转换逻辑，常见的方式有转换为 vw 或转换为 rem
 
+`{useSSR: boolean}`
+
+useSSR 默认值为 `false`，当 SSR 模式下使用异步分包时，需要将 useSSR 设置为 `true`, 其他场景不需要。
+
+`{disablePageTransition: boolean}`
+
+用于配置禁用/开启页面切换动画，默认禁用
+
+
 ```js
-// vue.config.js
+// mpx.config.js
 module.exports = defineConfig({
   pluginOptions: {
     mpx: {
@@ -834,7 +843,11 @@ module.exports = defineConfig({
           transRpxFn: function (match, $1) {
             if ($1 === '0') return $1
             return `${$1 * +(100 / 750).toFixed(8)}vw`
-          }
+          },
+          // 当 SSR 模式下使用异步分包时
+          useSSR: true,
+          // 开启页面切换动画
+          disablePageTransition: false
         }
       }
     }

docs-vitepress/api/extend.md

@@ -14,24 +14,24 @@ mpx-fetch提供了一个实例**xfetch** ，该实例包含以下api
 
     config 可指定以下属性：
     - **url**
-    
+
         `string`
-    
+
         设置请求url
     - **method**
 
         `string`
-    
+
         设置请求方式，默认为GET
     - **data**
 
         `object`
-    
+
         设置请求参数
     - **params**
 
         `object`
-    
+
         设置请求参数，参数会以 Query String 的形式进行传递
     - **header**
 
@@ -40,14 +40,14 @@ mpx-fetch提供了一个实例**xfetch** ，该实例包含以下api
         设置请求的 header，header 中不能设置 Referer。
         `content-type` 默认为 `application/json`
     - **timeout**
-                        
+
         `number`
-                        
+
         单位为毫秒。若不传，默认读取app.json文件中__networkTimeout属性。 对于超时的处理可在 catch 方法中进行
     - **emulateJSON**
 
         `boolean`
-    
+
         设置为 true 时，等价于 header = {'content-type': 'application/x-www-form-urlencoded'}
     - **usePre**
 
@@ -483,7 +483,7 @@ useFetch().fetch({
 | closeBLEConnection |:white_check_mark:|:white_check_mark:|:x:|:x:|
 | createBLEConnection |:white_check_mark:|:white_check_mark:|:x:|:x:|
 | onBLEConnectionStateChange |:white_check_mark:|:white_check_mark:|:x:|:x:|
-| createIntersectionObserver |:white_check_mark:|:white_check_mark:|:x:|:x:|
+| createIntersectionObserver |:white_check_mark:|:white_check_mark:|:white_check_mark:|:white_check_mark:|
 | createSelectorQuery |:white_check_mark:|:white_check_mark:|:white_check_mark:|:white_check_mark:|
 | getExtConfig |:white_check_mark:|:white_check_mark:|:x:|:x:|
 | getExtConfigSync |:white_check_mark:|:white_check_mark:|:x:|:x:|
@@ -565,6 +565,7 @@ useFetch().fetch({
 | onNetworkStatusChange |:white_check_mark:|:white_check_mark:|:white_check_mark:|:white_check_mark:|
 | offNetworkStatusChange |:white_check_mark:|:white_check_mark:|:white_check_mark:|:white_check_mark:|
 | createVideoContext |:white_check_mark:|:white_check_mark:|:white_check_mark:|:x:|
+| onLazyLoadError |:white_check_mark:|:white_check_mark:|:x:|:white_check_mark:|
 ## webview-bridge
 Mpx 支持小程序跨平台后，多个平台的小程序里都提供了 webview 组件，webview 打开的 H5 页面可以通过小程序提供的 API 来与小程序通信以及调用一些小程序的能力，但是各家小程序对于 webview 提供的API是不一样的。
 
@@ -694,20 +695,20 @@ Mpx框架项目包体积可以进行分组、分包、页面、冗余Npm包等
   `Array<object>`
 
   配置体积计算分组，以输入分组为维度对体积进行分析，当没有该配置时结果中将不会包含分组体积信息
-  
+
   - name
-  
+
     `string`
 
     分组名称
 
   - threshold
-  
+
     `string | object`
 
     分组相关体积阈值，若不配置则该分组不校验体积阈值，同时也支持对分组中占各分包体积阈值
 
-    
+
     ```html
     // 分组体积限额 500KB
     threshold: '500KB'
@@ -719,32 +720,32 @@ Mpx框架项目包体积可以进行分组、分包、页面、冗余Npm包等
       }
     }
     ```
-    
+
   - entryRules
-  
+
     `object`
-  
+
     配置分组 entry 匹配规则，小程序中所有的页面和组件都可被视为 entry
-  
+
       - include: 包含符合条件的入口文件，默认为空数组，规则数组中支持函数、正则、字符串
       - exclude: 剔除符合条件的入口文件，默认为空数组，规则数组中支持函数、正则、字符串
-    
-    
+
+
     ```html
     include: [/@someGroup\/some-npm-package/],
     exclude: [/@someGroup\/some-two-pack/]
     ```
-    
+
   - noEntryRules
 
     `object`
 
     配置计算分组中纯 js 入口引入的体积（不包含组件和页面）
-  
+
       - include: 包含符合条件的 js 文件，默认为空数组，规则数组中支持函数、正则、字符串
       - exclude: 剔除符合条件的 js 文件，默认为空数组，规则数组中支持函数、正则、字符串
-    
-    
+
+
     ```html
     include: [/@someGroup\/some-npm-package/],
     exclude: [/@someGroup\/some-two-pack/]
@@ -982,7 +983,7 @@ function t(key: string, choice?: number, values: Array | Object): TranslateResul
       }
     }
   }
-  
+
   createComponent({
     setup(){
         const { t } = useI18n({

docs-vitepress/assets/images/ide-mpx-official-demo-1.png

@@ -10,13 +10,14 @@
 * 支付宝小程序
 * 字节小程序
 * Web
+* RN
 
 在非上述平台，异步分包代码会默认降级。
 
 ## 跨分包自定义组件引用
 >一个分包使用其他分包的自定义组件时，由于其他分包还未下载或注入，其他分包的组件处于不可用的状态。通过为其他分包的自定义组件设置 占位组件，
 我们可以先渲染占位组件作为替代，在分包下载完成后再进行替换。
-> 
+>
 在 Mpx 中使用跨分包自定义组件引用通过?root声明组件所属异步分包即可使用，示例如下：
 ```html
 <!--/packageA/pages/index.mpx-->
@@ -33,7 +34,7 @@
   }
 </script>
 ```
-- 注意项：目前该能力已在微信、支付宝和Web环境下支持，其他环境下框架将进行自动降级。
+- 注意项：目前该能力已在微信、支付宝、Web和RN环境下支持，其他环境下框架将进行自动降级。
 
 ## 跨分包 JS 代码引用
 >一个分包中的代码引用其它分包的代码时，为了不让下载阻塞代码运行，我们需要异步获取引用的结果

docs-vitepress/assets/images/ide-mpx-official-demo-2.png

@@ -630,7 +630,7 @@ onShow|是
 onHide|是
 onUnload|是
 onError|是
-onServerPrefetch｜是
+onServerPrefetch|是
 created|是
 attached|是
 ready|是

docs-vitepress/guide/advance/async-subpackage.md

@@ -151,8 +151,6 @@ createComponent({
 })
 </script>
 ```
-// TODO data 的注意项
-
 
 ### computed