From 10223783afc060dda30dd258731147a317342750 Mon Sep 17 00:00:00 2001
From: Amorcy <yangcheng0113@163.com>
Date: Fri, 13 Oct 2023 16:25:09 +0800
Subject: [PATCH 01/35] =?UTF-8?q?chore:=20=E9=87=8D=E6=9E=84mpx-video?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lib/runtime/components/web/mpx-video.vue  | 522 +++++++++---------
 1 file changed, 265 insertions(+), 257 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
index c9bf40d34b..1c6fc8fac5 100755
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
@@ -1,259 +1,267 @@
 <template>
   <video
-    ref="_mpx_video_ref"
-    :class="classList"
-    :src="src"
-    :controls="showControlsTool"
-    :autoplay="autoplay"
-    :loop="loop"
-    :muted="mutedCopy"
-    :poster="poster"
-    v-bind="playsinlineAttr"
-  >
-  </video>
-</template>
-
-<script>
-  import { inheritEvent } from './getInnerListeners'
-
-  export default {
-    name: 'mpx-video',
-    props: {
-      src: { // done
-        type: String,
-        default: ''
-      },
-      duration: Number,
-      controls: { // done
-        type: Boolean,
-        default: true
-      },
-      danmuList: {
-        type: Array,
-        default: () => {
-          return []
-        }
-      },
-      danmuBtn: {
-        type: Boolean,
-        default: false
-      },
-      enableDanmu: {
-        type: Boolean,
-        default: false
-      },
-      autoplay: { // done
-        type: Boolean,
-        default: false
-      },
-      loop: { // done
-        type: Boolean,
-        default: false
-      },
-      muted: { // done
-        type: Boolean,
-        default: false
-      },
-      initialTime: { // done
-        type: Number,
-        default: 0
-      },
-      direction: Number,
-      showProgress: { // done
-        type: Boolean,
-        default: true
-      },
-      showFullscreenBtn: { // done
-        type: Boolean,
-        default: true
-      },
-      showPlayBtn: { // done
-        type: Boolean,
-        default: true
-      },
-      showCenterPlayBtn: { // done
-        type: Boolean,
-        default: true
-      },
-      enableProgressGesture: {
-        type: Boolean,
-        default: true
-      },
-      objectFit: {
-        type: String,
-        default: 'contain'
-      },
-      poster: String, // done
-      showMuteBtn: { // done
-        type: Boolean,
-        default: false
-      },
-      title: String,
-      playBtnPosition: {
-        type: String,
-        default: 'bottom'
-      },
-      enablePlayGesture: {
-        type: Boolean,
-        default: false
-      },
-      vslideGesture: {
-        type: Boolean,
-        default: true
-      },
-      vslideGestureInFullscreen: {
-        type: Boolean,
-        default: true
-      },
-      adUnitId: String,
-      posterForCrawle: String,
-      showCastingButton: {
-        type: Boolean,
-        default: false
-      },
-      pictureInPictureMode: {},
-      pictureInPictureShowProgress: {
-        type: Boolean,
-        default: false
-      },
-      enableAutoRotation: {
-        type: Boolean,
-        default: false
-      },
-      showScreenLockButton: {
-        type: Boolean,
-        default: false
-      },
-      playsinline: {
-        type: Boolean,
-        default: true
-      }
-    },
-    computed: {
-      playsinlineAttr () {
-        if (!this.playsinline) return {}
-        return {
-          'webkit-playsinline': true,
-          'playsinline': true,
-          'x5-playsinline': true
-        }
-      }
-    },
-    data () {
-      return {
-        showControlsTool: this.controls,
-        mutedCopy: this.muted,
-        classList: ''
-      }
-    },
-    watch: {
-      muted (val) {
-        this.mutedCopy = val
-      }
-    },
-    mounted () {
-      this.initStyle()
-      this.initEvent()
-    },
-    methods: {
-      initStyle () {
-        const videoNode = this.$refs['_mpx_video_ref']
-        if (this.initialTime) {
-          videoNode.currentTime = this.initialTime
-        }
-        if (this.autoplay) { // log 解决autoplay无法自动播放问题
-          this.mutedCopy = true
-        }
-        if (!this.showProgress) this.classList += ' mpx-no-show_progress'
-        if (!this.showFullscreenBtn) this.classList += ' mpx-no-show_fullscreen_btn'
-        if (!this.showPlayBtn) this.classList += ' mpx-no-show_play_btn'
-        if (!this.showCenterPlayBtn) this.classList += ' mpx-no-show_center_play_btn'
-        if (!this.showMuteBtn) this.classList += ' mpx-no-show_mute_btn'
-      },
-      initEvent () {
-        const videoNode = this.$refs['_mpx_video_ref']
-
-        videoNode.addEventListener('play', (e) => {
-          this.$emit('play', inheritEvent('play', e, {}))
-        })
-
-        videoNode.addEventListener('pause', (e) => {
-          this.$emit('pause', inheritEvent('pause', e, {}))
-        })
-
-        videoNode.addEventListener('ended', (e) => {
-          this.$emit('ended', inheritEvent('ended', e, {}))
-        })
-
-        videoNode.addEventListener('timeupdate', (e) => {
-          const eNode = e.target
-          this.$emit('timeupdate', inheritEvent('timeupdate', e, { currentTime: eNode.currentTime, duration: eNode.duration }))
-        })
-
-        videoNode.addEventListener('error', (e) => {
-          this.$emit('error', inheritEvent('error', e, {}))
-        })
-
-        videoNode.addEventListener('waiting', (e) => {
-          this.$emit('waiting', inheritEvent('waiting', e, {}))
-        })
-
-        videoNode.addEventListener('loadedmetadata', (e) => {
-          const eNode = e.target
-          this.$emit('loadedmetadata', inheritEvent('loadedmetadata', e, { width: eNode.videoWidth, height: eNode.videoHeight, duration: eNode.duration }))
-        })
-
-        videoNode.addEventListener('progress', (e) => {
-          const eNode = e.target
-          const buffered = (eNode?.buffered?.end(0)) / (eNode?.duration)
-          this.$emit('progress', inheritEvent('progress', e, { buffered: buffered * 100 }))
-        })
-
-        videoNode.addEventListener('seeked', (e) => {
-          const eNode = e.target
-          this.$emit('seekcomplete', inheritEvent('seekcomplete', e, { position: eNode.currentTime }))
-        })
-
-        videoNode.addEventListener('fullscreenchange', (e) => {
-          //  TODO direction
-          if (document.isFullScreen) {
-            this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: true }))
-          } else {
-            this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: false }))
-          }
-        })
-
-        videoNode.addEventListener('enterpictureinpicture', (e) => {
-          this.$emit('enterpictureinpicture', inheritEvent('enterpictureinpicture', e, {}))
-        })
-
-        videoNode.addEventListener('leavepictureinpicture', (e) => {
-          this.$emit('leavepictureinpicture', inheritEvent('leavepictureinpicture', e, {}))
-        })
-      }
-    }
-  }
-</script>
-
-<style lang="stylus">
-  .mpx-video-container
-    .mpx-no-show_progress
-      &::-webkit-media-controls-timeline
-        display none !important
-
-    .mpx-no-show_fullscreen_btn
-      &::-webkit-media-controls-fullscreen-button
-        display none !important
-
-    .mpx-no-show_play_btn
-      &::-webkit-media-controls-play-button
-        display none !important
-
-    .mpx-no-show_center_play_btn
-      &::-webkit-media-controls-start-playback-button
-        display none !important
-
-    .mpx-no-show_mute_btn
-      &::-webkit-media-controls-mute-button
-        display none !important
-</style>
+     ref="_mpx_video_ref"
+     class="video-js"
+   ></video>
+ </template>
+ <script>
+   import { inheritEvent } from './getInnerListeners'
+   import videojs from 'video.js'
+   import 'video.js/dist/video-js.min.css'
+ 
+   export default {
+     name: 'mpx-video',
+     props: {
+       src: { // done
+         type: String,
+         default: ''
+       },
+       duration: Number,
+       controls: { // done
+         type: Boolean,
+         default: true
+       },
+       danmuList: {
+         type: Array,
+         default: () => {
+           return []
+         }
+       },
+       danmuBtn: {
+         type: Boolean,
+         default: false
+       },
+       enableDanmu: {
+         type: Boolean,
+         default: false
+       },
+       autoplay: { // done
+         type: Boolean,
+         default: false
+       },
+       loop: { // done
+         type: Boolean,
+         default: false
+       },
+       muted: { // done
+         type: Boolean,
+         default: false
+       },
+       initialTime: {
+         type: Number,
+         default: 0
+       },
+       direction: Number,
+       showProgress: { // done
+         type: Boolean,
+         default: true
+       },
+       showBottomProgress: { // done
+         type: Boolean,
+         default: true
+       },
+       showFullscreenBtn: { // done
+         type: Boolean,
+         default: true
+       },
+       showPlayBtn: { // done
+         type: Boolean,
+         default: true
+       },
+       showCenterPlayBtn: { // done
+         type: Boolean,
+         default: true
+       },
+       enableProgressGesture: {
+         type: Boolean,
+         default: true
+       },
+       objectFit: {
+         type: String,
+         default: 'contain'
+       },
+       poster: String, // done
+       showMuteBtn: { // done
+         type: Boolean,
+         default: false
+       },
+       title: String,
+       playBtnPosition: {
+         type: String,
+         default: 'bottom'
+       },
+       enablePlayGesture: {
+         type: Boolean,
+         default: false
+       },
+       vslideGesture: {
+         type: Boolean,
+         default: true
+       },
+       vslideGestureInFullscreen: {
+         type: Boolean,
+         default: true
+       },
+       adUnitId: String,
+       posterForCrawle: String,
+       showCastingButton: {
+         type: Boolean,
+         default: false
+       },
+       pictureInPictureMode: {},
+       pictureInPictureShowProgress: {
+         type: Boolean,
+         default: false
+       },
+       enableAutoRotation: {
+         type: Boolean,
+         default: false
+       },
+       showScreenLockButton: {
+         type: Boolean,
+         default: false
+       }
+     },
+     data () {
+       return {
+         player: null
+       }
+     },
+     watch: {
+       muted: function (val) {
+         this.player?.muted(val)
+       },
+       controls: function (show) {
+         this.$emit('controlstoggle', inheritEvent('controlstoggle', {}, { show }))
+       }
+     },
+     mounted () {
+       const videoNode = this.$refs['_mpx_video_ref']
+       this.player = videojs(videoNode, {
+         controls: true,
+         sources:[
+           {
+             src: this.src
+           }
+         ],
+         autoplay: this.autoplay,
+         loop: this.loop,
+         // log 若 controls 属性值为 false 则设置 poster 无效
+         poster: this.controls ? this.poster : ''
+       }, function () {
+       })
+       this.initPlayer()
+       this.initStyle()
+       this.initEvent()
+       console.log('%c [ this.player ]-141', 'font-size:13px; background:pink; color:#bf2c9f;', this.player)
+     },
+     methods: {
+       initPlayer () {
+         this.player.muted(this.muted)
+         if (this.initialTime) {
+           this.player.currentTime(this.initialTime)
+         }
+       },
+       initStyle () {
+         if (!this.controls) this.player.el_.classList.add('mpx-no-show_controls')
+ 
+         if (!this.showBottomProgress) this.player.el_.classList.add('mpx-no-show_progress')
+ 
+         // showProgress若不设置，宽度大于240时才会显示
+         if (!this.showProgress || (this.player.el_.offsetWidth < 240 && this.showProgress)) this.player.el_.classList.add('mpx-no-show_progress')
+ 
+         if (!this.showFullscreenBtn) this.player.el_.classList.add('mpx-no-show_fullscreen_btn')
+ 
+         if (!this.showPlayBtn) this.player.el_.classList.add('mpx-no-show_play_btn')
+ 
+         if (!this.showCenterPlayBtn) this.player.el_.classList.add('mpx-no-show_center_play_btn')
+ 
+         if (!this.showMuteBtn) this.player.el_.classList.add('mpx-no-show_mute_btn')
+       },
+       initEvent () {
+         this.player.on('play', (e) => {
+           this.$emit('play', inheritEvent('play', e, {}))
+         })
+ 
+         this.player.on('pause', (e) => {
+           this.$emit('pause', inheritEvent('pause', e, {}))
+         })
+ 
+         this.player.on('ended', (e) => {
+           this.$emit('ended', inheritEvent('ended', e, {}))
+         })
+ 
+         this.player.on('timeupdate', (e) => {
+           this.$emit('timeupdate', inheritEvent('timeupdate', e, {}))
+         })
+ 
+         this.player.on('error', (e) => {
+           this.$emit('error', inheritEvent('error', e, {}))
+         })
+ 
+         this.player.on('waiting', (e) => {
+           this.$emit('waiting', inheritEvent('waiting', e, {}))
+         })
+         this.player.on('loadedmetadata', (e) => {
+           this.$emit('loadedmetadata', inheritEvent('loadedmetadata', e, {}))
+         })
+ 
+         this.player.on('progress', (e) => {
+           const eNode = e.target
+           const buffered = (eNode?.buffered?.end(0)) / (eNode?.duration)
+           this.$emit('progress', inheritEvent('progress', e, { buffered: buffered * 100 }))
+         })
+ 
+         this.player.on('seeked', (e) => {
+           const eNode = e.target
+           this.$emit('seekcomplete', inheritEvent('seekcomplete', e, { position: eNode.currentTime  }))
+         })
+ 
+         this.player.on('fullscreenchange', (e) => {
+           if (document.isFullScreen) {
+             this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: true }))
+           } else {
+             this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: false }))
+           }
+         })
+ 
+         this.player.on('enterpictureinpicture', (e) => {
+           this.$emit('enterpictureinpicture', inheritEvent('enterpictureinpicture', e, {}))
+         })
+ 
+         this.player.on('leavepictureinpicture', (e) => {
+           this.$emit('leavepictureinpicture', inheritEvent('leavepictureinpicture', e, {}))
+         })
+ 
+       }
+     }
+   }
+ </script>
+ 
+ <style lang="stylus">
+ 
+   .mpx-no-show_controls
+     .vjs-control-bar
+       display none !important
+ 
+   .mpx-no-show_progress
+     .vjs-progress-control
+       display none !important
+ 
+   .mpx-no-show_fullscreen_btn
+     .vjs-fullscreen-control
+       display none !important
+ 
+   .mpx-no-show_play_btn
+     .vjs-play-control
+       display none !important
+ 
+   .mpx-no-show_center_play_btn
+     .vjs-big-play-button
+       display none !important
+ 
+   .mpx-no-show_mute_btn
+     .vjs-mute-control
+       display none !important
+ </style>
+ 
\ No newline at end of file

From 641eec2f1a2da30d1ec392c758ac63935507ec05 Mon Sep 17 00:00:00 2001
From: Amorcy <yangcheng0113@163.com>
Date: Wed, 18 Oct 2023 19:43:18 +0800
Subject: [PATCH 02/35] =?UTF-8?q?chore:=20mpx-video=20=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lib/runtime/components/web/mpx-video.vue  | 505 +++++++++---------
 packages/webpack-plugin/package.json          |   3 +-
 2 files changed, 266 insertions(+), 242 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
index 1c6fc8fac5..78493a7df9 100755
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
@@ -1,267 +1,290 @@
 <template>
   <video
-     ref="_mpx_video_ref"
-     class="video-js"
+    ref="_mpx_video_ref"
+    class="video-js"
+    v-bind="playsinlineAttr"
    ></video>
  </template>
  <script>
-   import { inheritEvent } from './getInnerListeners'
-   import videojs from 'video.js'
-   import 'video.js/dist/video-js.min.css'
- 
-   export default {
-     name: 'mpx-video',
-     props: {
-       src: { // done
-         type: String,
-         default: ''
-       },
-       duration: Number,
-       controls: { // done
-         type: Boolean,
-         default: true
-       },
-       danmuList: {
-         type: Array,
-         default: () => {
-           return []
-         }
-       },
-       danmuBtn: {
-         type: Boolean,
-         default: false
-       },
-       enableDanmu: {
-         type: Boolean,
-         default: false
-       },
-       autoplay: { // done
-         type: Boolean,
-         default: false
-       },
-       loop: { // done
-         type: Boolean,
-         default: false
-       },
-       muted: { // done
-         type: Boolean,
-         default: false
-       },
-       initialTime: {
-         type: Number,
-         default: 0
-       },
-       direction: Number,
-       showProgress: { // done
-         type: Boolean,
-         default: true
-       },
-       showBottomProgress: { // done
-         type: Boolean,
-         default: true
-       },
-       showFullscreenBtn: { // done
-         type: Boolean,
-         default: true
-       },
-       showPlayBtn: { // done
-         type: Boolean,
-         default: true
-       },
-       showCenterPlayBtn: { // done
-         type: Boolean,
-         default: true
-       },
-       enableProgressGesture: {
-         type: Boolean,
-         default: true
-       },
-       objectFit: {
-         type: String,
-         default: 'contain'
-       },
-       poster: String, // done
-       showMuteBtn: { // done
-         type: Boolean,
-         default: false
-       },
-       title: String,
-       playBtnPosition: {
-         type: String,
-         default: 'bottom'
-       },
-       enablePlayGesture: {
-         type: Boolean,
-         default: false
-       },
-       vslideGesture: {
-         type: Boolean,
-         default: true
-       },
-       vslideGestureInFullscreen: {
-         type: Boolean,
-         default: true
-       },
-       adUnitId: String,
-       posterForCrawle: String,
-       showCastingButton: {
-         type: Boolean,
-         default: false
-       },
-       pictureInPictureMode: {},
-       pictureInPictureShowProgress: {
-         type: Boolean,
-         default: false
-       },
-       enableAutoRotation: {
-         type: Boolean,
-         default: false
-       },
-       showScreenLockButton: {
-         type: Boolean,
-         default: false
-       }
-     },
-     data () {
-       return {
-         player: null
-       }
-     },
-     watch: {
-       muted: function (val) {
-         this.player?.muted(val)
-       },
-       controls: function (show) {
-         this.$emit('controlstoggle', inheritEvent('controlstoggle', {}, { show }))
-       }
-     },
-     mounted () {
-       const videoNode = this.$refs['_mpx_video_ref']
-       this.player = videojs(videoNode, {
-         controls: true,
-         sources:[
-           {
-             src: this.src
-           }
-         ],
-         autoplay: this.autoplay,
-         loop: this.loop,
-         // log 若 controls 属性值为 false 则设置 poster 无效
-         poster: this.controls ? this.poster : ''
-       }, function () {
-       })
-       this.initPlayer()
-       this.initStyle()
-       this.initEvent()
-       console.log('%c [ this.player ]-141', 'font-size:13px; background:pink; color:#bf2c9f;', this.player)
-     },
-     methods: {
-       initPlayer () {
-         this.player.muted(this.muted)
-         if (this.initialTime) {
-           this.player.currentTime(this.initialTime)
-         }
-       },
-       initStyle () {
-         if (!this.controls) this.player.el_.classList.add('mpx-no-show_controls')
- 
-         if (!this.showBottomProgress) this.player.el_.classList.add('mpx-no-show_progress')
- 
-         // showProgress若不设置，宽度大于240时才会显示
-         if (!this.showProgress || (this.player.el_.offsetWidth < 240 && this.showProgress)) this.player.el_.classList.add('mpx-no-show_progress')
- 
-         if (!this.showFullscreenBtn) this.player.el_.classList.add('mpx-no-show_fullscreen_btn')
- 
-         if (!this.showPlayBtn) this.player.el_.classList.add('mpx-no-show_play_btn')
- 
-         if (!this.showCenterPlayBtn) this.player.el_.classList.add('mpx-no-show_center_play_btn')
- 
-         if (!this.showMuteBtn) this.player.el_.classList.add('mpx-no-show_mute_btn')
-       },
-       initEvent () {
-         this.player.on('play', (e) => {
-           this.$emit('play', inheritEvent('play', e, {}))
-         })
- 
-         this.player.on('pause', (e) => {
-           this.$emit('pause', inheritEvent('pause', e, {}))
-         })
- 
-         this.player.on('ended', (e) => {
-           this.$emit('ended', inheritEvent('ended', e, {}))
-         })
- 
-         this.player.on('timeupdate', (e) => {
-           this.$emit('timeupdate', inheritEvent('timeupdate', e, {}))
-         })
- 
-         this.player.on('error', (e) => {
-           this.$emit('error', inheritEvent('error', e, {}))
-         })
- 
-         this.player.on('waiting', (e) => {
-           this.$emit('waiting', inheritEvent('waiting', e, {}))
-         })
-         this.player.on('loadedmetadata', (e) => {
-           this.$emit('loadedmetadata', inheritEvent('loadedmetadata', e, {}))
-         })
- 
-         this.player.on('progress', (e) => {
-           const eNode = e.target
-           const buffered = (eNode?.buffered?.end(0)) / (eNode?.duration)
-           this.$emit('progress', inheritEvent('progress', e, { buffered: buffered * 100 }))
-         })
- 
-         this.player.on('seeked', (e) => {
-           const eNode = e.target
-           this.$emit('seekcomplete', inheritEvent('seekcomplete', e, { position: eNode.currentTime  }))
-         })
- 
-         this.player.on('fullscreenchange', (e) => {
-           if (document.isFullScreen) {
-             this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: true }))
-           } else {
-             this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: false }))
-           }
-         })
- 
-         this.player.on('enterpictureinpicture', (e) => {
-           this.$emit('enterpictureinpicture', inheritEvent('enterpictureinpicture', e, {}))
-         })
- 
-         this.player.on('leavepictureinpicture', (e) => {
-           this.$emit('leavepictureinpicture', inheritEvent('leavepictureinpicture', e, {}))
-         })
- 
-       }
-     }
-   }
+  import { inheritEvent } from './getInnerListeners'
+  import videojs from 'video.js'
+  import 'video.js/dist/video-js.min.css'
+
+  export default {
+    name: 'mpx-video',
+    props: {
+      src: { // done
+        type: String,
+        default: ''
+      },
+      duration: Number,
+      controls: { // done
+        type: Boolean,
+        default: true
+      },
+      danmuList: {
+        type: Array,
+        default: () => {
+          return []
+        }
+      },
+      danmuBtn: {
+        type: Boolean,
+        default: false
+      },
+      enableDanmu: {
+        type: Boolean,
+        default: false
+      },
+      autoplay: { // done
+        type: Boolean,
+        default: false
+      },
+      loop: { // done
+        type: Boolean,
+        default: false
+      },
+      muted: { // done
+        type: Boolean,
+        default: false
+      },
+      initialTime: {
+        type: Number,
+        default: 0
+      },
+      direction: Number,
+      showProgress: { // done
+        type: Boolean,
+        default: true
+      },
+      showBottomProgress: { // done
+        type: Boolean,
+        default: true
+      },
+      showFullscreenBtn: { // done
+        type: Boolean,
+        default: true
+      },
+      showPlayBtn: { // done
+        type: Boolean,
+        default: true
+      },
+      showCenterPlayBtn: { // done
+        type: Boolean,
+        default: true
+      },
+      enableProgressGesture: {
+        type: Boolean,
+        default: true
+      },
+      objectFit: {
+        type: String,
+        default: 'contain'
+      },
+      poster: String, // done
+      showMuteBtn: { // done
+        type: Boolean,
+        default: false
+      },
+      title: String,
+      playBtnPosition: {
+        type: String,
+        default: 'bottom'
+      },
+      enablePlayGesture: {
+        type: Boolean,
+        default: false
+      },
+      vslideGesture: {
+        type: Boolean,
+        default: true
+      },
+      vslideGestureInFullscreen: {
+        type: Boolean,
+        default: true
+      },
+      adUnitId: String,
+      posterForCrawle: String,
+      showCastingButton: {
+        type: Boolean,
+        default: false
+      },
+      pictureInPictureMode: {},
+      pictureInPictureShowProgress: {
+        type: Boolean,
+        default: false
+      },
+      enableAutoRotation: {
+        type: Boolean,
+        default: false
+      },
+      showScreenLockButton: {
+        type: Boolean,
+        default: false
+      },
+      playsinline: {
+      type: Boolean,
+      default: true
+    }
+    },
+    data () {
+      return {
+        player: null
+      }
+    },
+    computed: {
+    playsinlineAttr () {
+      if (!this.playsinline) return {}
+      return {
+        'webkit-playsinline': true,
+        'playsinline': true,
+        'x5-playsinline': true,
+        'x5-video-orientation': 'landscape|portrait'
+      }
+    }
+  },
+    watch: {
+      muted: function (val) {
+        this.player?.muted(val)
+      },
+      controls: function (show) {
+        this.$emit('controlstoggle', inheritEvent('controlstoggle', {}, { show }))
+      }
+    },
+    mounted () {
+      const videoNode = this.$refs['_mpx_video_ref']
+      this.player = videojs(videoNode, {
+        controls: true,
+        sources:[
+          {
+            src: this.src
+          }
+        ],
+        autoplay: this.autoplay,
+        loop: this.loop,
+         /**
+          log 若 controls 属性值为 false 则设置 poster 无效
+        */
+        poster: this.controls ? this.poster : ''
+      }, function () {
+      })
+      this.initPlayer()
+      this.initStyle()
+      this.initEvent()
+    },
+    methods: {
+      initPlayer () {
+        this.player.muted(this.muted)
+        if (this.initialTime) {
+          this.player.currentTime(this.initialTime)
+        }
+      },
+      initStyle () {
+        if (!this.controls) this.player.el_.classList.add('mpx-no-show_controls')
+
+        if (!this.showBottomProgress) this.player.el_.classList.add('mpx-no-show_progress')
+
+        /**
+          showProgress若不设置，宽度大于240时才会显示
+        */
+        if (!this.showProgress || (this.player.el_.offsetWidth < 240 && this.showProgress)) this.player.el_.classList.add('mpx-no-show_progress')
+
+        if (!this.showFullscreenBtn) this.player.el_.classList.add('mpx-no-show_fullscreen_btn')
+
+        if (!this.showPlayBtn) this.player.el_.classList.add('mpx-no-show_play_btn')
+
+        if (!this.showCenterPlayBtn) this.player.el_.classList.add('mpx-no-show_center_play_btn')
+
+        if (!this.showMuteBtn) this.player.el_.classList.add('mpx-no-show_mute_btn')
+      },
+      initEvent () {
+
+        this.player.on('play', (e) => {
+          this.$emit('play', inheritEvent('play', e, {}))
+        })
+
+        this.player.on('pause', (e) => {
+          this.$emit('pause', inheritEvent('pause', e, {}))
+        })
+
+        this.player.on('ended', (e) => {
+          this.$emit('ended', inheritEvent('ended', e, {}))
+        })
+
+        this.player.on('timeupdate', (e) => {
+          this.$emit('timeupdate', inheritEvent('timeupdate', e, {}))
+        })
+
+        this.player.on('error', (e) => {
+          this.$emit('error', inheritEvent('error', e, {}))
+        })
+
+        this.player.on('waiting', (e) => {
+          this.$emit('waiting', inheritEvent('waiting', e, {}))
+        })
+        this.player.on('loadedmetadata', (e) => {
+          this.$emit('loadedmetadata', inheritEvent('loadedmetadata', e, {}))
+        })
+
+        this.player.on('progress', (e) => {
+          const eNode = e.target
+          const buffered = (eNode?.buffered?.end(0)) / (eNode?.duration)
+          this.$emit('progress', inheritEvent('progress', e, { buffered: buffered * 100 }))
+        })
+
+        this.player.on('seeked', (e) => {
+          const eNode = e.target
+          this.$emit('seekcomplete', inheritEvent('seekcomplete', e, { position: eNode.currentTime  }))
+        })
+        this.player.on('fullscreenchange', (e) => {
+          if (!this.player.paused()) {
+            // hack: 解决退出全屏自动暂停
+            setTimeout(() => {
+              this.player.play()
+            }, 500)
+          }
+          this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: this.player.isFullscreen() }))
+        })
+
+        this.player.on('enterpictureinpicture', (e) => {
+          this.$emit('enterpictureinpicture', inheritEvent('enterpictureinpicture', e, {}))
+        })
+
+        this.player.on('leavepictureinpicture', (e) => {
+          this.$emit('leavepictureinpicture', inheritEvent('leavepictureinpicture', e, {}))
+        })
+
+      }
+    }
+  }
  </script>
- 
+
  <style lang="stylus">
- 
+
+    .vjs-chapters-button
+      display: none !important
+
    .mpx-no-show_controls
      .vjs-control-bar
        display none !important
- 
+
    .mpx-no-show_progress
      .vjs-progress-control
        display none !important
- 
+
    .mpx-no-show_fullscreen_btn
      .vjs-fullscreen-control
        display none !important
- 
+
    .mpx-no-show_play_btn
      .vjs-play-control
        display none !important
- 
+
    .mpx-no-show_center_play_btn
      .vjs-big-play-button
        display none !important
- 
+
    .mpx-no-show_mute_btn
      .vjs-mute-control
        display none !important
  </style>
- 
\ No newline at end of file
diff --git a/packages/webpack-plugin/package.json b/packages/webpack-plugin/package.json
index c913a9bcea..063b5768d4 100644
--- a/packages/webpack-plugin/package.json
+++ b/packages/webpack-plugin/package.json
@@ -54,7 +54,8 @@
     "postcss-modules-values": "^4.0.0",
     "postcss-selector-parser": "^6.0.8",
     "postcss-value-parser": "^4.0.2",
-    "source-list-map": "^2.0.0"
+    "source-list-map": "^2.0.0",
+    "video.js": "^8.6.0"
   },
   "peerDependencies": {
     "webpack": "^5.48.0"

From e5c62693d0dc5547921a6e9c189064bc1ff33556 Mon Sep 17 00:00:00 2001
From: xiaolei <xiaolei@didichuxing.com>
Date: Thu, 19 Oct 2023 11:28:40 +0800
Subject: [PATCH 03/35] [docs]update docs

---
 docs-vuepress/guide/advance/i18n.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs-vuepress/guide/advance/i18n.md b/docs-vuepress/guide/advance/i18n.md
index e240a4a99d..e2e27cf20d 100644
--- a/docs-vuepress/guide/advance/i18n.md
+++ b/docs-vuepress/guide/advance/i18n.md
@@ -313,7 +313,7 @@ import mpx, { createComponent } from '@mpxjs/core'
 createComponent({
   ready () {
       // 修改全局 locale
-      mpx.i18n.global.locale = 'en-US'
+      mpx.i18n.global.locale.value = 'en-US'
   }
 })
 ```

From 11c23581775df72999188d80b812979771a307be Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Fri, 20 Oct 2023 12:06:09 +0800
Subject: [PATCH 04/35] =?UTF-8?q?=E8=A1=A5=E5=85=85readme?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/webview-bridge/README.md | 82 ++++++++++++++++++++++++++++++-
 1 file changed, 81 insertions(+), 1 deletion(-)

diff --git a/packages/webview-bridge/README.md b/packages/webview-bridge/README.md
index 325de5153e..ad8a68ddbb 100644
--- a/packages/webview-bridge/README.md
+++ b/packages/webview-bridge/README.md
@@ -1,3 +1,83 @@
 # @mpxjs/webview-bridge
 
-为跨小程序平台提供通用的webview-bridge
+> 为跨小程序平台提供通用的webview-bridge
+
+## Usage
+
+抹平了各端JSSDK方法调用逻辑，统一挂载在webviewBridge对象上提供调用
+
+```js
+import webviewBridge from '@mpxjs/webview-bridge'
+const { navigateBack, postMessage } = webviewBridge
+postMessage({
+  data: 'test',
+  success (res) {
+    console.log('postmessage成功回调, 结果：', res)
+  }
+})
+navigateBack()
+```
+
+### 各端支持情况说明
+- **微信小程序：**
+
+    提供可调用方法参考微信web-view组件 JSSDK提供能力
+    
+    [jssdk接口1](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法直接调用即可(参考Usage示例)
+    
+    [jssdk接口2](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法需要传入config配置后再调用，webview-bridge提供了对应的config方法，该方法只在微信小程序环境下生效，使用示例如下
+    ```js
+    import webviewBridge from '@mpxjs/webview-bridge'
+    // 具体传入配置参考微信说明
+    webviewBridge.config({
+      debug: true,
+      appId: '',
+      timestamp: '',
+      nonceStr: '',
+      signature: '',
+      jsApiList: []
+    })
+    // 在微信小程序下调用wx.ready方法中调用接口2能力
+    wx.ready(function () {
+      webviewBridge.updateAppMessageShareData({ 
+         title: '',
+         desc: '',
+         link: '',
+         imgUrl: '',
+         success: function () {
+         }
+      })
+    })
+    ```
+- **支付宝、百度、QQ、抖音小程序：**
+
+    支持各小程序web-view组件 JSSDK提供的方法，直接调用webviewBridge上挂载的对应方法即可(参考Usage示例)
+    
+    ::: warning
+    各小程序接口1以外的方法提供的不尽相同，在支持多小程序运行的h5调用中，建议调用非通用的方法时，增加判空的容错处理
+    :::
+    
+ - **webapp：** 
+ 
+    微信[jssdk接口1](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法可以直接调用webviewBridge上挂载的对应方法(参考Usage示例)
+    
+    微信[jssdk接口2](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法目前只支持getLocation方法的调用
+    
+     - **getLocation方法使用介绍：** 
+     
+        小程序转webapp的项目本身没有getLocation的能力，需要在webapp属主中增加getLocaiton的方法挂载，挂载示例如下：
+    
+        ```js
+           // webapp app.web.js
+            ...
+            mpx.config.webviewConfig = {
+                // 必须在webapp进行挂载否则h5中调用不到getLocation的返回
+                apiImplementations: {
+                    getLocation () {
+                        // 提供一个异步的方法
+                    }
+                }
+            }
+            ...
+        ```
+   

From 81f8f475fd0b97affb975a0cd66a68bbc10db564 Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Fri, 20 Oct 2023 12:51:53 +0800
Subject: [PATCH 05/35] =?UTF-8?q?=E4=BF=AE=E6=AD=A3=E6=96=87=E6=A1=88?=
 =?UTF-8?q?=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/webview-bridge/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/webview-bridge/README.md b/packages/webview-bridge/README.md
index ad8a68ddbb..28d65c5b65 100644
--- a/packages/webview-bridge/README.md
+++ b/packages/webview-bridge/README.md
@@ -65,7 +65,7 @@ navigateBack()
     
      - **getLocation方法使用介绍：** 
      
-        小程序转webapp的项目本身没有getLocation的能力，需要在webapp属主中增加getLocaiton的方法挂载，挂载示例如下：
+        小程序转webapp的项目本身没有getLocation的能力，需要在webapp属主中增加getLocation的方法挂载，挂载示例如下：
     
         ```js
            // webapp app.web.js

From 5585009a6d898a995147b6b02011069e78434337 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Fri, 20 Oct 2023 12:59:12 +0800
Subject: [PATCH 06/35] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=BE=93?=
 =?UTF-8?q?=E5=87=BAali/web=20root-view=20srcMode=E5=88=A4=E6=96=AD?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs-vuepress/api/compile.md                  | 76 +++++++++----------
 .../lib/template-compiler/compiler.js         |  2 +-
 2 files changed, 37 insertions(+), 41 deletions(-)

diff --git a/docs-vuepress/api/compile.md b/docs-vuepress/api/compile.md
index 82a6ccc22a..2ef97433a5 100644
--- a/docs-vuepress/api/compile.md
+++ b/docs-vuepress/api/compile.md
@@ -1565,50 +1565,13 @@ module.exports = defineConfig({
 })
 ```
 
-## MpxWebpackPlugin static methods
-
-`MpxWebpackPlugin` 通过静态方法暴露了以下五个内置 loader，详情如下：
-
-### MpxWebpackPlugin.loader
-
-`MpxWebpackPlugin` 所提供的最主要 loader，用于处理 `.mpx` 文件，根据不同的[目标平台](#mode)将 `.mpx` 文件输出为不同的结果。
-
-> 在微信环境下 `todo.mpx` 被loader处理后的文件为：`todo.wxml`、`todo.wxss`、`todo.js`、`todo.json`
-
-```js
-module.exports = {
-  module: {
-    rules: [
-      {
-        test: /\.mpx$/,
-        use: MpxWebpackPlugin.loader()
-      }
-    ]
-  }
-};
-```
-
-::: tip
-在 `@mpxjs/cli 3.x`版本已经内置了对于 `pug` 的支持，只需要安装 `pug` 依赖相关即可：
-
-```javascript
-npm install -D pug pug-plain-loader
-```
-:::
-
-##### Options.excludedPreLoaders `{RegExp}`
-
-在构建过程中忽略特定 `pre-loader` 对文件的处理，仅支持正则表达式，默认值为 `/eslint-loader/`。
-
 ### proxyComponentEventsRules
 
 - **类型**：`Array<Object> | Object`
   - `option.include` 同webpack的include规则
   - `option.exclude` 同webpack的exclude规则
   - `option.events` 需要在支付宝环境代理的事件，数组形式的支付宝事件名，例如['onTap', 'onTouchMove']
-
-- **详细**：
-
+  
 在微信小程序中，自定义组件本身的那个节点是一个“普通”的节点，使用时可以在这个节点上设置 class style、事件、 flex 布局等，就如同普通的 view 组件节点一样。
 
 在支付宝平台下，自定义组件节点默认是虚拟节点，会展示自定义组件内部的第一层节点，自定义组件节点本身设置的 class style 等不会生效。
@@ -1619,8 +1582,6 @@ style、class、绑定事件等 copy 至包裹节点，对于事件来说，由
 
 跨端输出Web时，为了和微信小程序保持一致，在非virtualHost的自定义组件节点上，默认也会插入一个包裹节点，同理对于事件的代理也需要用户进行配置告诉框架来对哪些自定义组件的哪些事件进行代理。
 
-- **示例**：
-
 当我们在小程序开发时存在以下代码时
 ```html
 <!--自定义组件list-->
@@ -1651,6 +1612,41 @@ new MpxWebpackPlugin({
 请注意，在跨端输出 Web 时，只支持配置 tap 、longtap、longpress 这三个事件代理，且最好不要同时配置了两个事件，不然有可能会导致同一个事件触发两次。
 
 
+## MpxWebpackPlugin static methods
+
+`MpxWebpackPlugin` 通过静态方法暴露了以下五个内置 loader，详情如下：
+
+### MpxWebpackPlugin.loader
+
+`MpxWebpackPlugin` 所提供的最主要 loader，用于处理 `.mpx` 文件，根据不同的[目标平台](#mode)将 `.mpx` 文件输出为不同的结果。
+
+> 在微信环境下 `todo.mpx` 被loader处理后的文件为：`todo.wxml`、`todo.wxss`、`todo.js`、`todo.json`
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.mpx$/,
+        use: MpxWebpackPlugin.loader()
+      }
+    ]
+  }
+};
+```
+
+::: tip
+在 `@mpxjs/cli 3.x`版本已经内置了对于 `pug` 的支持，只需要安装 `pug` 依赖相关即可：
+
+```javascript
+npm install -D pug pug-plain-loader
+```
+:::
+
+##### Options.excludedPreLoaders `{RegExp}`
+
+在构建过程中忽略特定 `pre-loader` 对文件的处理，仅支持正则表达式，默认值为 `/eslint-loader/`。
+
 ### MpxWebpackPlugin.pluginLoader
 
 :::warning
diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js
index ba2462cfe3..c539615824 100644
--- a/packages/webpack-plugin/lib/template-compiler/compiler.js
+++ b/packages/webpack-plugin/lib/template-compiler/compiler.js
@@ -1795,7 +1795,7 @@ function processRootViewStyleClassHack (el, options, root) {
 
 // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。
 function getVirtualHostRoot (options, meta) {
-  if (options.isComponent) {
+  if (srcMode === 'wx' && options.isComponent) {
     // 处理组件时
     if (mode === 'wx' && options.hasVirtualHost) {
       // wx组件注入virtualHost配置

From 5643a44f5f1e47403b5ae0d066dfbae9a03892f1 Mon Sep 17 00:00:00 2001
From: hiyuki <674883329@qq.com>
Date: Fri, 20 Oct 2023 14:29:28 +0800
Subject: [PATCH 07/35] fix getCurrentInstance in web

---
 packages/core/src/platform/export/index.web.js | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/packages/core/src/platform/export/index.web.js b/packages/core/src/platform/export/index.web.js
index 048f06d82d..efb503d500 100644
--- a/packages/core/src/platform/export/index.web.js
+++ b/packages/core/src/platform/export/index.web.js
@@ -1,6 +1,7 @@
 import {
   effectScope as vueEffectScope,
-  getCurrentScope as getCurrentVueScope,
+  getCurrentScope as vueGetCurrentScope,
+  getCurrentInstance as vueGetCurrentInstance,
   onScopeDispose
 } from 'vue'
 
@@ -27,9 +28,7 @@ export {
   shallowRef,
   triggerRef,
   // computed
-  computed,
-  // instance
-  getCurrentInstance
+  computed
 } from 'vue'
 
 const noop = () => {
@@ -42,7 +41,13 @@ const fixEffectScope = (scope) => {
 }
 
 const effectScope = (detached) => fixEffectScope(vueEffectScope(detached))
-const getCurrentScope = () => fixEffectScope(getCurrentVueScope())
+const getCurrentScope = () => fixEffectScope(vueGetCurrentScope())
+const getCurrentInstance = () => vueGetCurrentInstance()?.proxy
+
+export {
+  // instance
+  getCurrentInstance
+}
 
 export {
   // effectScope

From 70ae471d721b11710d309b9efeaac96e4eccb51a Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Fri, 20 Oct 2023 15:13:56 +0800
Subject: [PATCH 08/35] =?UTF-8?q?fix:=20=E5=88=A0=E9=99=A4=E9=94=99?=
 =?UTF-8?q?=E8=AF=AF=E6=B3=A8=E9=87=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/webpack-plugin/lib/template-compiler/compiler.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js
index c539615824..ae00c3bda3 100644
--- a/packages/webpack-plugin/lib/template-compiler/compiler.js
+++ b/packages/webpack-plugin/lib/template-compiler/compiler.js
@@ -1810,7 +1810,6 @@ function getVirtualHostRoot (options, meta) {
           value: `${MPX_ROOT_VIEW} host-${options.moduleId}`
         }
       ])
-      // 添加时间处理
       processElement(rootView, rootView, options, meta)
       return rootView
     }

From 03a8dad3199ea2969f46ccaeef327baf3fedc782 Mon Sep 17 00:00:00 2001
From: hiyuki <674883329@qq.com>
Date: Fri, 20 Oct 2023 17:03:06 +0800
Subject: [PATCH 09/35] fix getCurrentInstance again

---
 packages/core/src/core/proxy.js                |  4 +++-
 packages/core/src/platform/export/index.web.js | 13 ++++---------
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/packages/core/src/core/proxy.js b/packages/core/src/core/proxy.js
index 81754b2c03..27129d02ba 100644
--- a/packages/core/src/core/proxy.js
+++ b/packages/core/src/core/proxy.js
@@ -607,7 +607,9 @@ export default class MpxProxy {
 
 export let currentInstance = null
 
-export const getCurrentInstance = () => currentInstance?.target
+export const getCurrentInstance = () => {
+  return currentInstance && { proxy: currentInstance?.target }
+}
 
 export const setCurrentInstance = (instance) => {
   currentInstance = instance
diff --git a/packages/core/src/platform/export/index.web.js b/packages/core/src/platform/export/index.web.js
index efb503d500..b51ef5672d 100644
--- a/packages/core/src/platform/export/index.web.js
+++ b/packages/core/src/platform/export/index.web.js
@@ -1,7 +1,6 @@
 import {
   effectScope as vueEffectScope,
-  getCurrentScope as vueGetCurrentScope,
-  getCurrentInstance as vueGetCurrentInstance,
+  getCurrentScope as vueGetCurrentScope
   onScopeDispose
 } from 'vue'
 
@@ -28,7 +27,9 @@ export {
   shallowRef,
   triggerRef,
   // computed
-  computed
+  computed,
+  // instance
+  getCurrentInstance
 } from 'vue'
 
 const noop = () => {
@@ -42,12 +43,6 @@ const fixEffectScope = (scope) => {
 
 const effectScope = (detached) => fixEffectScope(vueEffectScope(detached))
 const getCurrentScope = () => fixEffectScope(vueGetCurrentScope())
-const getCurrentInstance = () => vueGetCurrentInstance()?.proxy
-
-export {
-  // instance
-  getCurrentInstance
-}
 
 export {
   // effectScope

From e39ad9b35cdb336f271f424dbfae9cf7688c8d0d Mon Sep 17 00:00:00 2001
From: hiyuki <674883329@qq.com>
Date: Fri, 20 Oct 2023 17:15:55 +0800
Subject: [PATCH 10/35] v2.8.54

---
 lerna.json                           | 2 +-
 packages/core/package.json           | 2 +-
 packages/webpack-plugin/package.json | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/lerna.json b/lerna.json
index e02345c260..4eb1f1c1d6 100644
--- a/lerna.json
+++ b/lerna.json
@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "2.8.53"
+  "version": "2.8.54"
 }
diff --git a/packages/core/package.json b/packages/core/package.json
index ef26ebdb2a..967ee8f6c2 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.8.53",
+  "version": "2.8.54",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
diff --git a/packages/webpack-plugin/package.json b/packages/webpack-plugin/package.json
index 4ab4ce4c54..fa7f6231b1 100644
--- a/packages/webpack-plugin/package.json
+++ b/packages/webpack-plugin/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.8.53",
+  "version": "2.8.54",
   "description": "mpx compile core",
   "keywords": [
     "mpx"

From b0a60aaaccf87545b52658eff4db26395c1a205c Mon Sep 17 00:00:00 2001
From: hiyuki <674883329@qq.com>
Date: Fri, 20 Oct 2023 17:25:25 +0800
Subject: [PATCH 11/35] fix lint

---
 packages/core/src/platform/export/index.web.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/core/src/platform/export/index.web.js b/packages/core/src/platform/export/index.web.js
index b51ef5672d..e0c3c4cd82 100644
--- a/packages/core/src/platform/export/index.web.js
+++ b/packages/core/src/platform/export/index.web.js
@@ -1,6 +1,6 @@
 import {
   effectScope as vueEffectScope,
-  getCurrentScope as vueGetCurrentScope
+  getCurrentScope as vueGetCurrentScope,
   onScopeDispose
 } from 'vue'
 

From 8418ed27ec3cfa6307d8e0930a169cd7d09a1014 Mon Sep 17 00:00:00 2001
From: hiyuki <674883329@qq.com>
Date: Fri, 20 Oct 2023 17:25:50 +0800
Subject: [PATCH 12/35] v2.8.55

---
 lerna.json                 | 2 +-
 packages/core/package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/lerna.json b/lerna.json
index 4eb1f1c1d6..2ae753791c 100644
--- a/lerna.json
+++ b/lerna.json
@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "2.8.54"
+  "version": "2.8.55"
 }
diff --git a/packages/core/package.json b/packages/core/package.json
index 967ee8f6c2..dfb8c0c3a9 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.8.54",
+  "version": "2.8.55",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",

From 0d8fcb449823122ee6a6222e65754059c20987d7 Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Fri, 20 Oct 2023 19:31:02 +0800
Subject: [PATCH 13/35] =?UTF-8?q?fix=20web-view=E7=BB=84=E4=BB=B6=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91=E4=BB=A5=E5=8F=8Awebviewbridge=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/core/@types/index.d.ts               |  5 +-
 .../runtime/components/web/mpx-web-view.vue   | 56 +++++++++++--------
 packages/webview-bridge/README.md             | 20 +++----
 packages/webview-bridge/src/index.js          | 48 +++++++++-------
 4 files changed, 74 insertions(+), 55 deletions(-)

diff --git a/packages/core/@types/index.d.ts b/packages/core/@types/index.d.ts
index f688652d79..03ad8dd923 100644
--- a/packages/core/@types/index.d.ts
+++ b/packages/core/@types/index.d.ts
@@ -86,7 +86,7 @@ type PropValueType<Def> = Def extends {
   : Def extends FullPropType<infer T>
   ? T
   : Def extends PropType<infer T>
-  ? T 
+  ? T
   : any;
 
 type GetPropsType<T> = {
@@ -259,7 +259,8 @@ interface MpxConfig {
   proxyEventHandler: (e: Event) => any | null
   setDataHandler: (data: object, target: ComponentIns<{}, {}, {}, {}, []>) => any | null
   forceFlushSync: boolean,
-  webRouteConfig: object
+  webRouteConfig: object,
+  webviewConfig: object
 }
 
 type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'
diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
index fca2f2d549..8f2a518dd5 100644
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
@@ -1,5 +1,5 @@
 <template>
-  <iframe ref="mpxIframe" class="mpx-iframe" :src="currentUrl"></iframe>
+  <iframe ref="mpxIframe" class="mpx-iframe" :src="currentUrl" :key="currentUrl"></iframe>
 </template>
 
 <script>
@@ -18,8 +18,7 @@
         Loaded: false,
         isActived: false,
         mpxIframe: null,
-        isPostMessage: false,
-        currentUrl: ''
+        isPostMessage: false
       }
     },
     props: {
@@ -27,38 +26,51 @@
         type: String
       }
     },
-    watch: {
-      src (value) {
-        let host
-        host = value.split('/')
+    computed: {
+      host () {
+        let host = this.src.split('/')
         if (host[2]) {
           host = host[0] + '//' + host[2]
         } else {
           host = ''
         }
-        const hostValidate = this.hostValidate(host)
+        return host
+      },
+      currentUrl () {
+        if (!this.src) return ''
+        const hostValidate = this.hostValidate(this.host)
         if (!hostValidate) {
           console.error('访问页面域名不符合domainWhiteLists白名单配置，请确认是否正确配置该域名白名单')
-          return
+          return ''
+        }
+        return this.src
+      },
+      loadData () {
+        return {
+          src: this.host,
+          fullUrl: this.src
+        }
+      }
+    },
+    watch: {
+      currentUrl (value) {
+        if (!value) {
+          this.$emit(eventError, getCustomEvent(eventError, {
+            ...this.loadData,
+            errMsg: 'web-view load failed due to not in domain list'
+          }, this))
         }
-        this.currentUrl = value
-        this.mpxIframe = this.$refs.mpxIframe
-        this.mpxIframe.addEventListener('load', (event) => {
-          this.Loaded = true
-          const loadData = {
-            src: this.src
-          }
-          this.$emit(eventLoad, getCustomEvent(eventLoad, loadData, this))
-        })
       }
     },
     mounted () {
+      this.mpxIframe = this.$refs.mpxIframe
+      this.mpxIframe.addEventListener('load', (event) => {
+        this.Loaded = true
+        this.$emit(eventLoad, getCustomEvent(eventLoad, this.loadData, this))
+      })
       setTimeout(() => {
         if (!this.Loaded) {
-          const loadData = {
-            src: this.src
-          }
-          this.$emit(eventError, getCustomEvent(eventError, loadData, this))
+          this.$emit(eventError, getCustomEvent(eventError, this.loadData, this))
         }
       }, 1000)
       window.addEventListener('message', (event) => {
diff --git a/packages/webview-bridge/README.md b/packages/webview-bridge/README.md
index 28d65c5b65..b9f2869b86 100644
--- a/packages/webview-bridge/README.md
+++ b/packages/webview-bridge/README.md
@@ -25,7 +25,7 @@ navigateBack()
     
     [jssdk接口1](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法直接调用即可(参考Usage示例)
     
-    [jssdk接口2](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法需要传入config配置后再调用，webview-bridge提供了对应的config方法，该方法只在微信小程序环境下生效，使用示例如下
+    [jssdk接口2](https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html) 提供的方法需要传入config配置后再调用，webview-bridge提供了对应的config方法，该方法只在微信小程序环境下生效，使用示例如下：
     ```js
     import webviewBridge from '@mpxjs/webview-bridge'
     // 具体传入配置参考微信说明
@@ -37,16 +37,14 @@ navigateBack()
       signature: '',
       jsApiList: []
     })
-    // 在微信小程序下调用wx.ready方法中调用接口2能力
-    wx.ready(function () {
-      webviewBridge.updateAppMessageShareData({ 
-         title: '',
-         desc: '',
-         link: '',
-         imgUrl: '',
-         success: function () {
-         }
-      })
+    // wx.ready在框架内部抹平，直接调用方法即可
+    webviewBridge.updateAppMessageShareData({ 
+      title: '',
+      desc: '',
+      link: '',
+      imgUrl: '',
+      success: function () {
+      }
     })
     ```
 - **支付宝、百度、QQ、抖音小程序：**
diff --git a/packages/webview-bridge/src/index.js b/packages/webview-bridge/src/index.js
index d81db094ef..6d40b56987 100644
--- a/packages/webview-bridge/src/index.js
+++ b/packages/webview-bridge/src/index.js
@@ -49,8 +49,19 @@ if (systemUA.indexOf('AlipayClient') > -1) {
 }
 
 const initWebviewBridge = () => {
-  sdkReady = env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url, { crossOrigin: !!SDK_URL_MAP[env].crossOrigin }) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve()
-  getWebviewApi(sdkReady)
+  sdkReady = env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve()
+  getWebviewApi()
+}
+
+function runWebviewApiMethod (callback) {
+  if (window.__webview_sdkready__) {
+    callback()
+  } else {
+    sdkReady.then(() => {
+      window.__webview_sdkready__ = true
+      callback()
+    })
+  }
 }
 
 const webviewBridge = {
@@ -59,20 +70,11 @@ const webviewBridge = {
       console.warn('非微信环境不需要配置config')
       return
     }
-
-    if (sdkReady) {
-      sdkReady().then(() => {
-        if (window.wx) {
-          if (!config) {
-            console.warn('微信环境下需要配置wx.config才能挂载方法')
-            return
-          }
-          window.wx.config(config)
-        }
-      })
-    } else {
-      console.warn('wx对象未加载完成或者加载失败')
-    }
+    runWebviewApiMethod(() => {
+      if (window.wx) {
+        window.wx.config(config)
+      }
+    })
   }
 }
 
@@ -114,7 +116,7 @@ function postMessage (type, data) {
   }
 }
 
-const getWebviewApi = (sdkReady) => {
+const getWebviewApi = () => {
   const multiApiMap = {
     wx: {
       keyName: 'miniProgram',
@@ -252,7 +254,7 @@ const getWebviewApi = (sdkReady) => {
   const multiApiLists = multiApi.api || []
   multiApiLists.forEach((item) => {
     webviewBridge[item] = (...args) => {
-      return sdkReady.then(() => {
+      runWebviewApiMethod(() => {
         window[env][multiApi.keyName][item](...args)
       })
     }
@@ -260,9 +262,15 @@ const getWebviewApi = (sdkReady) => {
   singleApi.forEach((item) => {
     webviewBridge[item] = (...args) => {
       if (env === 'web') {
-        return postMessage(item, ...args)
+        postMessage(item, ...args)
+      } else if (env === 'wx') {
+        runWebviewApiMethod(() => {
+          window[env] && window[env].ready(() => {
+            window[env][item](...args)
+          })
+        })
       } else {
-        return sdkReady.then(() => {
+        runWebviewApiMethod(() => {
           window[env][item](...args)
         })
       }

From dcbf98599cf16a07127da80353a5bfc9920c039f Mon Sep 17 00:00:00 2001
From: xiaolei <xiaolei@didichuxing.com>
Date: Mon, 23 Oct 2023 13:17:00 +0800
Subject: [PATCH 14/35] [docs]update i18n

---
 docs-vuepress/guide/advance/i18n.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs-vuepress/guide/advance/i18n.md b/docs-vuepress/guide/advance/i18n.md
index e2e27cf20d..0c3573dab1 100644
--- a/docs-vuepress/guide/advance/i18n.md
+++ b/docs-vuepress/guide/advance/i18n.md
@@ -260,7 +260,7 @@ createComponent({
       // 全局locale变更，生效范围为项目全局，locale 是一个 ref 变量
       locale.value = 'zh-CN'
       // 或者通过mpx.i18n来修改，也能起到全局locale修改作用
-      mpx.i18n.global.locale.value = 'zh-CN'
+      mpx.i18n.locale = 'zh-CN'
     }, 1000)
     return {
         t
@@ -313,7 +313,7 @@ import mpx, { createComponent } from '@mpxjs/core'
 createComponent({
   ready () {
       // 修改全局 locale
-      mpx.i18n.global.locale.value = 'en-US'
+      mpx.i18n.locale = 'en-US'
   }
 })
 ```

From b7491c75587024a57b990c526c9959ffe5fd5e45 Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Mon, 23 Oct 2023 16:39:03 +0800
Subject: [PATCH 15/35] =?UTF-8?q?=E4=BF=AE=E6=AD=A3web-view=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../runtime/components/web/mpx-web-view.vue   | 33 ++++++++++++-------
 packages/webview-bridge/src/index.js          |  5 +--
 2 files changed, 24 insertions(+), 14 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
index 8f2a518dd5..8134aac07c 100644
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
@@ -53,21 +53,30 @@
       }
     },
     watch: {
-      currentUrl (value) {
-        if (!value) {
-          this.$emit(eventError, getCustomEvent(eventError, {
-            ...this.loadData,
-            errMsg: 'web-view load failed due to not in domain list'
-          }, this))
-        }
+      currentUrl: {
+        handler (value) {
+          this.mpxIframe = null
+          if (!value) {
+            this.$emit(eventError, getCustomEvent(eventError, {
+              ...this.loadData,
+              errMsg: 'web-view load failed due to not in domain list'
+            }, this))
+          } else {
+            this.$nextTick(() => {
+              this.mpxIframe = this.$refs.mpxIframe
+              if (this.mpxIframe) {
+                this.mpxIframe.addEventListener('load', (event) => {
+                  this.Loaded = true
+                  this.$emit(eventLoad, getCustomEvent(eventLoad, this.loadData, this))
+                })
+              }
+            })
+          }
+        },
+        immediate: true
       }
     },
     mounted () {
-      this.mpxIframe = this.$refs.mpxIframe
-      this.mpxIframe.addEventListener('load', (event) => {
-        this.Loaded = true
-        this.$emit(eventLoad, getCustomEvent(eventLoad, this.loadData, this))
-      })
       setTimeout(() => {
         if (!this.Loaded) {
           this.$emit(eventError, getCustomEvent(eventError, this.loadData, this))
diff --git a/packages/webview-bridge/src/index.js b/packages/webview-bridge/src/index.js
index 6d40b56987..e91771be7f 100644
--- a/packages/webview-bridge/src/index.js
+++ b/packages/webview-bridge/src/index.js
@@ -53,12 +53,13 @@ const initWebviewBridge = () => {
   getWebviewApi()
 }
 
+let webview_sdkready = false
 function runWebviewApiMethod (callback) {
-  if (window.__webview_sdkready__) {
+  if (webview_sdkready) {
     callback()
   } else {
     sdkReady.then(() => {
-      window.__webview_sdkready__ = true
+      webview_sdkready = true
       callback()
     })
   }

From d9aa66de97645121ee18ef9c99c496588637af83 Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Mon, 23 Oct 2023 16:44:29 +0800
Subject: [PATCH 16/35] =?UTF-8?q?=E5=8F=98=E9=87=8F=E6=94=B9=E6=88=90?=
 =?UTF-8?q?=E9=A9=BC=E5=B3=B0&=E5=8E=BB=E6=8E=89=E6=97=A0=E7=94=A8Load?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lib/runtime/components/web/mpx-web-view.vue            | 7 -------
 packages/webview-bridge/src/index.js                       | 6 +++---
 2 files changed, 3 insertions(+), 10 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
index 8134aac07c..e2b2322a56 100644
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
@@ -15,7 +15,6 @@
       return {
         origin: '',
         messageList: [],
-        Loaded: false,
         isActived: false,
         mpxIframe: null,
         isPostMessage: false
@@ -66,7 +65,6 @@
               this.mpxIframe = this.$refs.mpxIframe
               if (this.mpxIframe) {
                 this.mpxIframe.addEventListener('load', (event) => {
-                  this.Loaded = true
                   this.$emit(eventLoad, getCustomEvent(eventLoad, this.loadData, this))
                 })
               }
@@ -77,11 +75,6 @@
       }
     },
     mounted () {
-      setTimeout(() => {
-        if (!this.Loaded) {
-          this.$emit(eventError, getCustomEvent(eventError, this.loadData, this))
-        }
-      }, 1000)
       window.addEventListener('message', (event) => {
         const hostValidate = this.hostValidate(event.origin)
         const hasPostMessage = this.mpxIframe.contentWindow && this.mpxIframe.contentWindow.postMessage
diff --git a/packages/webview-bridge/src/index.js b/packages/webview-bridge/src/index.js
index e91771be7f..64de32d07d 100644
--- a/packages/webview-bridge/src/index.js
+++ b/packages/webview-bridge/src/index.js
@@ -53,13 +53,13 @@ const initWebviewBridge = () => {
   getWebviewApi()
 }
 
-let webview_sdkready = false
+let webviewSdkready = false
 function runWebviewApiMethod (callback) {
-  if (webview_sdkready) {
+  if (webviewSdkready) {
     callback()
   } else {
     sdkReady.then(() => {
-      webview_sdkready = true
+      webviewSdkready = true
       callback()
     })
   }

From 03d151375c0ee5558541fe1bdfb6540a855b6895 Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Mon, 23 Oct 2023 16:56:20 +0800
Subject: [PATCH 17/35] =?UTF-8?q?=E4=BC=98=E5=8C=96web-view=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/core/@types/index.d.ts               |  7 +++-
 .../runtime/components/web/mpx-web-view.vue   | 40 ++++++++-----------
 2 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/packages/core/@types/index.d.ts b/packages/core/@types/index.d.ts
index 03ad8dd923..379d785e11 100644
--- a/packages/core/@types/index.d.ts
+++ b/packages/core/@types/index.d.ts
@@ -250,6 +250,11 @@ interface AnyConstructor {
   prototype: any
 }
 
+interface WebviewConfig {
+  hostWhitelists?: Array<string>
+  apiImplementations?: object
+}
+
 interface MpxConfig {
   useStrictDiff: boolean
   ignoreWarning: boolean | string | RegExp | ((msg: string, location: string, e: Error) => boolean)
@@ -260,7 +265,7 @@ interface MpxConfig {
   setDataHandler: (data: object, target: ComponentIns<{}, {}, {}, {}, []>) => any | null
   forceFlushSync: boolean,
   webRouteConfig: object,
-  webviewConfig: object
+  webviewConfig?: WebviewConfig
 }
 
 type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'
diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
index e2b2322a56..651466c71c 100644
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
@@ -10,16 +10,10 @@
   const eventError = 'error'
   const eventMessage = 'message'
   const mpx = global.__mpx
+  const messageList = []
+  let isActived = false
+  let isPostMessage = false
   export default {
-    data: function () {
-      return {
-        origin: '',
-        messageList: [],
-        isActived: false,
-        mpxIframe: null,
-        isPostMessage: false
-      }
-    },
     props: {
       src: {
         type: String
@@ -80,36 +74,36 @@
         const hasPostMessage = this.mpxIframe.contentWindow && this.mpxIframe.contentWindow.postMessage
         const data = event.data
         const value = data.payload
-        if (!this.isActived || !hostValidate) {
+        if (!isActived || !hostValidate) {
           return
         }
         let asyncCallback = null
         switch (data.type) {
           case 'postMessage':
-            this.isPostMessage = true
-            this.messageList.push(value.data)
+            isPostMessage = true
+            messageList.push(value.data)
             asyncCallback = Promise.resolve({
               errMsg: 'invokeWebappApi:ok'
             })
             break
           case 'navigateTo':
-            this.isActived = false
+            isActived = false
             asyncCallback = navigateTo(value)
             break
           case 'navigateBack':
-            this.isActived = false
+            isActived = false
             asyncCallback = value ? navigateBack(value) : navigateBack()
             break
           case 'redirectTo':
-            this.isActived = false
+            isActived = false
             asyncCallback = redirectTo(value)
             break
           case 'switchTab':
-            this.isActived = false
+            isActived = false
             asyncCallback = switchTab(value)
             break
           case 'reLaunch':
-            this.isActived = false
+            isActived = false
             asyncCallback = reLaunch(value)
             break
           case 'getLocation':
@@ -139,26 +133,26 @@
       })
     },
     activated () {
-      this.isActived = true
-      this.isPostMessage = false
+      isActived = true
+      isPostMessage = false
     },
     deactivated () {
-      if (!this.isPostMessage) {
+      if (!isPostMessage) {
         return
       }
       let data = {
         type: 'message',
-        data: this.messageList
+        data: messageList
       }
       this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
     },
     destroyed () {
-      if (!this.isPostMessage) {
+      if (!isPostMessage) {
         return
       }
       let data = {
         type: 'message',
-        data: this.messageList
+        data: messageList
       }
       this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
     },

From 9a836b01a415ae0b33af7c5a736d49ca23d103ec Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Mon, 23 Oct 2023 17:06:11 +0800
Subject: [PATCH 18/35] =?UTF-8?q?=E8=BE=93=E5=87=BAweb=20mpx-root-view?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0class=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/webpack-plugin/lib/style-compiler/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/webpack-plugin/lib/style-compiler/index.js b/packages/webpack-plugin/lib/style-compiler/index.js
index 767da39df3..567b9ec900 100644
--- a/packages/webpack-plugin/lib/style-compiler/index.js
+++ b/packages/webpack-plugin/lib/style-compiler/index.js
@@ -89,7 +89,7 @@ module.exports = function (css, map) {
       .process(css, options)
       .then(result => {
         // ali环境添加全局样式抹平root差异
-        if (mode === 'ali' && isApp) {
+        if ((mode === 'ali' || mode === 'web') && isApp) {
           result.css += `\n.${MPX_ROOT_VIEW} { display: initial }\n.${MPX_APP_MODULE_ID} { line-height: normal }`
         }
 

From 988092fdd84040b2906b140816498601332926d3 Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Mon, 23 Oct 2023 17:15:53 +0800
Subject: [PATCH 19/35] =?UTF-8?q?fix=E9=80=BB=E8=BE=91=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../runtime/components/web/mpx-web-view.vue   | 34 +++++++++----------
 packages/webview-bridge/src/index.js          |  2 +-
 2 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
index 651466c71c..7829f169b7 100644
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
@@ -10,9 +10,6 @@
   const eventError = 'error'
   const eventMessage = 'message'
   const mpx = global.__mpx
-  const messageList = []
-  let isActived = false
-  let isPostMessage = false
   export default {
     props: {
       src: {
@@ -68,42 +65,45 @@
         immediate: true
       }
     },
+    beforeCreate () {
+      this.messageList = []
+    },
     mounted () {
       window.addEventListener('message', (event) => {
         const hostValidate = this.hostValidate(event.origin)
         const hasPostMessage = this.mpxIframe.contentWindow && this.mpxIframe.contentWindow.postMessage
         const data = event.data
         const value = data.payload
-        if (!isActived || !hostValidate) {
+        if (!this.isActived || !hostValidate) {
           return
         }
         let asyncCallback = null
         switch (data.type) {
           case 'postMessage':
-            isPostMessage = true
-            messageList.push(value.data)
+            this.isPostMessage = true
+            this.messageList.push(value)
             asyncCallback = Promise.resolve({
               errMsg: 'invokeWebappApi:ok'
             })
             break
           case 'navigateTo':
-            isActived = false
+            this.isActived = false
             asyncCallback = navigateTo(value)
             break
           case 'navigateBack':
-            isActived = false
+            this.isActived = false
             asyncCallback = value ? navigateBack(value) : navigateBack()
             break
           case 'redirectTo':
-            isActived = false
+            this.isActived = false
             asyncCallback = redirectTo(value)
             break
           case 'switchTab':
-            isActived = false
+            this.isActived = false
             asyncCallback = switchTab(value)
             break
           case 'reLaunch':
-            isActived = false
+            this.isActived = false
             asyncCallback = reLaunch(value)
             break
           case 'getLocation':
@@ -133,26 +133,26 @@
       })
     },
     activated () {
-      isActived = true
-      isPostMessage = false
+      this.isActived = true
+      this.isPostMessage = false
     },
     deactivated () {
-      if (!isPostMessage) {
+      if (!this.isPostMessage) {
         return
       }
       let data = {
         type: 'message',
-        data: messageList
+        data: this.messageList
       }
       this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
     },
     destroyed () {
-      if (!isPostMessage) {
+      if (!this.isPostMessage) {
         return
       }
       let data = {
         type: 'message',
-        data: messageList
+        data: this.messageList
       }
       this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
     },
diff --git a/packages/webview-bridge/src/index.js b/packages/webview-bridge/src/index.js
index 64de32d07d..e738217972 100644
--- a/packages/webview-bridge/src/index.js
+++ b/packages/webview-bridge/src/index.js
@@ -92,7 +92,7 @@ function filterData (data) {
   return newData
 }
 
-function postMessage (type, data) {
+function postMessage (type, data = {}) {
   if (type !== 'getEnv') {
     const currentCallbackId = ++callbackId
     callbacks[currentCallbackId] = (err, res) => {

From 125b9a4e0c509d7c596f452488b21fe3046ad45b Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Mon, 23 Oct 2023 19:21:28 +0800
Subject: [PATCH 20/35] =?UTF-8?q?=E4=BF=AE=E6=94=B9getmessage=E6=8E=A5?=
 =?UTF-8?q?=E6=94=B6=E5=A4=9A=E6=AC=A1=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../runtime/components/web/mpx-web-view.vue   | 72 ++++++++-----------
 1 file changed, 31 insertions(+), 41 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
index 7829f169b7..8737dab68c 100644
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-web-view.vue
@@ -45,7 +45,6 @@
     watch: {
       currentUrl: {
         handler (value) {
-          this.mpxIframe = null
           if (!value) {
             this.$emit(eventError, getCustomEvent(eventError, {
               ...this.loadData,
@@ -53,8 +52,8 @@
             }, this))
           } else {
             this.$nextTick(() => {
-              this.mpxIframe = this.$refs.mpxIframe
-              if (this.mpxIframe) {
+              if (this.$refs.mpxIframe && this.mpxIframe != this.$refs.mpxIframe) {
+                this.mpxIframe = this.$refs.mpxIframe
                 this.mpxIframe.addEventListener('load', (event) => {
                   this.$emit(eventLoad, getCustomEvent(eventLoad, this.loadData, this))
                 })
@@ -69,41 +68,58 @@
       this.messageList = []
     },
     mounted () {
-      window.addEventListener('message', (event) => {
+      window.addEventListener('message', this.messageCallback)
+    },
+    deactivated () {
+      if (!this.messageList.length) {
+        return
+      }
+      let data = {
+        type: 'message',
+        data: this.messageList
+      }
+      this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
+    },
+    destroyed () {
+      window.removeEventListener('message', this.messageCallback)
+      if (!this.messageList.length) {
+        return
+      }
+      let data = {
+        type: 'message',
+        data: this.messageList
+      }
+      this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
+    },
+    methods: {
+      messageCallback (event) {
         const hostValidate = this.hostValidate(event.origin)
-        const hasPostMessage = this.mpxIframe.contentWindow && this.mpxIframe.contentWindow.postMessage
         const data = event.data
         const value = data.payload
-        if (!this.isActived || !hostValidate) {
+        if (!hostValidate) {
           return
         }
         let asyncCallback = null
         switch (data.type) {
           case 'postMessage':
-            this.isPostMessage = true
             this.messageList.push(value)
             asyncCallback = Promise.resolve({
               errMsg: 'invokeWebappApi:ok'
             })
             break
           case 'navigateTo':
-            this.isActived = false
             asyncCallback = navigateTo(value)
             break
           case 'navigateBack':
-            this.isActived = false
             asyncCallback = value ? navigateBack(value) : navigateBack()
             break
           case 'redirectTo':
-            this.isActived = false
             asyncCallback = redirectTo(value)
             break
           case 'switchTab':
-            this.isActived = false
             asyncCallback = switchTab(value)
             break
           case 'reLaunch':
-            this.isActived = false
             asyncCallback = reLaunch(value)
             break
           case 'getLocation':
@@ -118,45 +134,19 @@
             break
         }
         asyncCallback && asyncCallback.then((res) => {
-          hasPostMessage && this.mpxIframe.contentWindow.postMessage({
+          this.mpxIframe && this.mpxIframe.contentWindow && this.mpxIframe.contentWindow.postMessage && this.mpxIframe.contentWindow.postMessage({
             type: data.type,
             callbackId: data.callbackId,
             result: res
           }, event.origin)
         }).catch((error) => {
-          hasPostMessage && this.mpxIframe.contentWindow.postMessage({
+          this.mpxIframe && this.mpxIframe.contentWindow && this.mpxIframe.contentWindow.postMessage && this.mpxIframe.contentWindow.postMessage({
             type: data.type,
             callbackId: data.callbackId,
             error
           }, event.origin)
         })
-      })
-    },
-    activated () {
-      this.isActived = true
-      this.isPostMessage = false
-    },
-    deactivated () {
-      if (!this.isPostMessage) {
-        return
-      }
-      let data = {
-        type: 'message',
-        data: this.messageList
-      }
-      this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
-    },
-    destroyed () {
-      if (!this.isPostMessage) {
-        return
-      }
-      let data = {
-        type: 'message',
-        data: this.messageList
-      }
-      this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
-    },
-    methods: {
+      },
       hostValidate (host) {
         const hostWhitelists = mpx.config.webviewConfig && mpx.config.webviewConfig.hostWhitelists || []
         if (hostWhitelists.length) {

From 391feabc6246acfa17271aa632adf5da2c308a05 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Tue, 24 Oct 2023 10:25:19 +0800
Subject: [PATCH 21/35] v2.8.56

---
 lerna.json                           | 2 +-
 packages/core/package.json           | 2 +-
 packages/webpack-plugin/package.json | 2 +-
 packages/webview-bridge/package.json | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/lerna.json b/lerna.json
index 2ae753791c..768a35afab 100644
--- a/lerna.json
+++ b/lerna.json
@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "2.8.55"
+  "version": "2.8.56"
 }
diff --git a/packages/core/package.json b/packages/core/package.json
index dfb8c0c3a9..fc09fe7f3c 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.8.55",
+  "version": "2.8.56",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
diff --git a/packages/webpack-plugin/package.json b/packages/webpack-plugin/package.json
index fa7f6231b1..8f8c3ad68d 100644
--- a/packages/webpack-plugin/package.json
+++ b/packages/webpack-plugin/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.8.54",
+  "version": "2.8.56",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
diff --git a/packages/webview-bridge/package.json b/packages/webview-bridge/package.json
index 90f8797e12..a1b3cb0443 100644
--- a/packages/webview-bridge/package.json
+++ b/packages/webview-bridge/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webview-bridge",
-  "version": "2.8.53",
+  "version": "2.8.56",
   "description": "a bridge for mpx webview",
   "author": "skyadmin",
   "license": "ISC",

From ec06c39d5d6597df1ffd46ac3092c7b2b9f220ad Mon Sep 17 00:00:00 2001
From: wangxiaokou <w-cuijuan@163.com>
Date: Tue, 24 Oct 2023 16:29:47 +0800
Subject: [PATCH 22/35] =?UTF-8?q?=E8=A1=A5=E5=85=85=E6=BC=8F=E5=8F=91?=
 =?UTF-8?q?=E6=96=87=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/mpx-webview/H5/webviewbridge.min.js  |  2 +-
 .../dist/webviewbridge.esm.browser.js         | 79 +++++++++---------
 .../dist/webviewbridge.esm.browser.min.js     |  2 +-
 .../webview-bridge/dist/webviewbridge.esm.js  | 80 +++++++++----------
 packages/webview-bridge/dist/webviewbridge.js | 80 +++++++++----------
 .../webview-bridge/dist/webviewbridge.min.js  |  2 +-
 6 files changed, 123 insertions(+), 122 deletions(-)

diff --git a/examples/mpx-webview/H5/webviewbridge.min.js b/examples/mpx-webview/H5/webviewbridge.min.js
index 31e192d0d3..7c24aee855 100644
--- a/examples/mpx-webview/H5/webviewbridge.min.js
+++ b/examples/mpx-webview/H5/webviewbridge.min.js
@@ -8,4 +8,4 @@
  * (c) 2023 @mpxjs team
  * @license Apache
  */
-var e,t;e=this,t=function(){"use strict";function e(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function t(e,t,o){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var o=e[Symbol.toPrimitive];if(void 0!==o){var n=o.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}var o=function(o){for(var n=1;n<arguments.length;n++){var a=null!=arguments[n]?arguments[n]:{};n%2?e(Object(a),!0).forEach((function(e){t(o,e,a[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(a)):e(Object(a)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(a,e))}))}return o}({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},ali:{url:"https://appx/web-view.min.js"},baidu:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://s3.pstatp.com/toutiao/tmajssdk/jssdk.js"}},window.sdkUrlMap),n=null,a=0,r={},i=navigator.userAgent;i.indexOf("AlipayClient")>-1?n="my":i.toLowerCase().indexOf("miniprogram")>-1?n=i.indexOf("QQ")>-1?"qq":"wx":i.indexOf("swan")>-1?n="swan":i.indexOf("toutiao")>-1?n="tt":(n="web",window.addEventListener("message",(function(e){e.data.isMpxWebview&&(n="web",window.parent.postMessage({type:"load",detail:{load:!0}},"*"));var t=e.data,o=t.callbackId,a=t.error,i=t.result;void 0!==o&&r[o]&&(a?r[o](a):r[o](null,i),delete r[o])}),!1));var c={config:function(e){if("wx"===n){if(window.wx){if(!e)return void console.log("\u5fae\u4fe1\u73af\u5883\u4e0b\u9700\u8981\u914d\u7f6ewx.config\u624d\u80fd\u6302\u8f7d\u65b9\u6cd5");window.wx.config(e)}}else console.log("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function s(e){if("[object Object]"!==Object.prototype.toString.call(e))return e;var t={};for(var o in e)"function"!=typeof e[o]&&(t[o]=e[o]);return t}function p(e,t){if("getEnv"!==e){var o=++a;r[o]=function(e,n){e?(t.fail&&t.fail(e),t.complete&&t.complete(e)):(t.success&&t.success(n),t.complete&&t.complete(n)),delete r[o]},window.parent.postMessage&&window.parent.postMessage({type:e,callbackId:a,detail:{data:s(t)}},"*")}else t({miniprogram:!1})}var d=function(e){var t={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[n]||{},o={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation"]}[n]||{};(t.api||[]).forEach((function(o){c[o]=function(){for(var a=arguments.length,r=new Array(a),i=0;i<a;i++)r[i]=arguments[i];return e.then((function(){var e;(e=window[n][t.keyName])[o].apply(e,r)}))}})),o.forEach((function(t){c[t]=function(){for(var o=arguments.length,a=new Array(o),r=0;r<o;r++)a[r]=arguments[r];return"web"===n?p.apply(void 0,[t].concat(a)):e.then((function(){var e;(e=window[n])[t].apply(e,a)}))}}))};return function(){if(null===n)return console.log("mpxjs/webview: \u672a\u8bc6\u522b\u7684\u73af\u5883\uff0c\u5f53\u524d\u4ec5\u652f\u6301 \u5fae\u4fe1\u3001\u652f\u4ed8\u5b9d\u3001\u767e\u5ea6\u3001\u5934\u6761 QQ \u5c0f\u7a0b\u5e8f"),void d();var e=window[n]||"web"===n?Promise.resolve():o[n].url?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=t.time,n=void 0===o?5e3:o,a=t.crossOrigin,r=void 0!==a&&a;function i(){return new Promise((function(t,o){var n=document.createElement("script");n.type="text/javascript",n.async="async",r&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(t(),n.onload=n.onreadystatechange=null)},n.onerror=function(){o(new Error("load ".concat(e," error"))),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}))}function c(){return new Promise((function(t,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),n)}))}return Promise.race([i(),c()])}(o[n].url,{crossOrigin:!!o[n].crossOrigin}):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk"));d(e)}(),c},"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).mpx=t();
\ No newline at end of file
+var e,t;e=this,t=function(){"use strict";function e(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function t(e,t,o){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var o=e[Symbol.toPrimitive];if(void 0!==o){var n=o.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}var o,n=function(o){for(var n=1;n<arguments.length;n++){var a=null!=arguments[n]?arguments[n]:{};n%2?e(Object(a),!0).forEach((function(e){t(o,e,a[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(a)):e(Object(a)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(a,e))}))}return o}({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},ali:{url:"https://appx/web-view.min.js"},baidu:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://s3.pstatp.com/toutiao/tmajssdk/jssdk.js"}},window.sdkUrlMap),a=null,r=0,i={},c=navigator.userAgent;c.indexOf("AlipayClient")>-1?a="my":c.toLowerCase().indexOf("miniprogram")>-1?a=c.indexOf("QQ")>-1?"qq":"wx":c.indexOf("swan")>-1?a="swan":c.indexOf("toutiao")>-1?a="tt":(a="web",window.addEventListener("message",(function(e){var t=e.data,o=t.callbackId,n=t.error,a=t.result;void 0!==o&&i[o]&&(n?i[o](n):i[o](null,a),delete i[o])}),!1));var s=!1;function p(e){s?e():o.then((function(){s=!0,e()}))}var u={config:function(e){"wx"===a?p((function(){window.wx&&window.wx.config(e)})):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function d(e){if("[object Object]"!==Object.prototype.toString.call(e))return e;var t={};for(var o in e)"function"!=typeof e[o]&&(t[o]=e[o]);return t}function l(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if("getEnv"!==e){var o=++r;i[o]=function(e,n){e?(t.fail&&t.fail(e),t.complete&&t.complete(e)):(t.success&&t.success(n),t.complete&&t.complete(n)),delete i[o]},window.parent.postMessage&&window.parent.postMessage({type:e,callbackId:r,payload:d(t)},"*")}else t({webapp:!0})}var g=function(){var e={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[a]||{},t={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation"]}[a]||{};(e.api||[]).forEach((function(t){u[t]=function(){for(var o=arguments.length,n=new Array(o),r=0;r<o;r++)n[r]=arguments[r];p((function(){var o;(o=window[a][e.keyName])[t].apply(o,n)}))}})),t.forEach((function(e){u[e]=function(){for(var t=arguments.length,o=new Array(t),n=0;n<t;n++)o[n]=arguments[n];"web"===a?l.apply(void 0,[e].concat(o)):p("wx"===a?function(){window[a]&&window[a].ready((function(){var t;(t=window[a])[e].apply(t,o)}))}:function(){var t;(t=window[a])[e].apply(t,o)})}}))};return o="web"!==a?n[a].url?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=t.time,n=void 0===o?5e3:o,a=t.crossOrigin,r=void 0!==a&&a;function i(){return new Promise((function(t,o){var n=document.createElement("script");n.type="text/javascript",n.async="async",r&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(t(),n.onload=n.onreadystatechange=null)},n.onerror=function(){o(new Error("load ".concat(e," error"))),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}))}function c(){return new Promise((function(t,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),n)}))}return Promise.race([i(),c()])}(n[a].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),g(),u},"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).mpx=t();
\ No newline at end of file
diff --git a/packages/webview-bridge/dist/webviewbridge.esm.browser.js b/packages/webview-bridge/dist/webviewbridge.esm.browser.js
index 7d90fc7b45..b386b0ade1 100644
--- a/packages/webview-bridge/dist/webviewbridge.esm.browser.js
+++ b/packages/webview-bridge/dist/webviewbridge.esm.browser.js
@@ -43,6 +43,7 @@ function loadScript (url, { time = 5000, crossOrigin = false } = {}) {
   return Promise.race([request(), timeout()])
 }
 
+let sdkReady;
 const SDK_URL_MAP = {
   wx: {
     url: 'https://res.wx.qq.com/open/js/jweixin-1.3.2.js'
@@ -78,16 +79,7 @@ if (systemUA.indexOf('AlipayClient') > -1) {
 } else {
   env = 'web';
   window.addEventListener('message', (event) => {
-    if (event.data.isMpxWebview) {
-      env = 'web';
-      window.parent.postMessage({
-        type: 'load',
-        detail: {
-          load: true
-        }
-      }, '*');
-    }
-    // 接收webview返回的数据location等
+    // 接收web-view的回调
     const { callbackId, error, result } = event.data;
     if (callbackId !== undefined && callbacks[callbackId]) {
       if (error) {
@@ -100,23 +92,38 @@ if (systemUA.indexOf('AlipayClient') > -1) {
   }, false);
 }
 
+const initWebviewBridge = () => {
+  sdkReady = env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve();
+  getWebviewApi();
+};
+
+let webviewSdkready = false;
+function runWebviewApiMethod (callback) {
+  if (webviewSdkready) {
+    callback();
+  } else {
+    sdkReady.then(() => {
+      webviewSdkready = true;
+      callback();
+    });
+  }
+}
+
 const webviewBridge = {
   config (config) {
     if (env !== 'wx') {
-      console.log('非微信环境不需要配置config');
+      console.warn('非微信环境不需要配置config');
       return
     }
-    if (window.wx) {
-      if (!config) {
-        console.log('微信环境下需要配置wx.config才能挂载方法');
-        return
+    runWebviewApiMethod(() => {
+      if (window.wx) {
+        window.wx.config(config);
       }
-      window.wx.config(config);
-    }
+    });
   }
 };
 
-function mergeData (data) {
+function filterData (data) {
   if (Object.prototype.toString.call(data) !== '[object Object]') {
     return data
   }
@@ -129,7 +136,7 @@ function mergeData (data) {
   return newData
 }
 
-function postMessage (type, data) {
+function postMessage (type, data = {}) {
   if (type !== 'getEnv') {
     const currentCallbackId = ++callbackId;
     callbacks[currentCallbackId] = (err, res) => {
@@ -145,28 +152,16 @@ function postMessage (type, data) {
     window.parent.postMessage && window.parent.postMessage({
       type,
       callbackId,
-      detail: {
-        data: mergeData(data)
-      }
+      payload: filterData(data)
     }, '*');
   } else {
     data({
-      miniprogram: false
+      webapp: true
     });
   }
 }
 
-const initWebviewBridge = () => {
-  if (env === null) {
-    console.log('mpxjs/webview: 未识别的环境，当前仅支持 微信、支付宝、百度、头条 QQ 小程序');
-    getWebviewApi();
-    return
-  }
-  const sdkReady = !window[env] && env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url, { crossOrigin: !!SDK_URL_MAP[env].crossOrigin }) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve();
-  getWebviewApi(sdkReady);
-};
-
-const getWebviewApi = (sdkReady) => {
+const getWebviewApi = () => {
   const multiApiMap = {
     wx: {
       keyName: 'miniProgram',
@@ -304,19 +299,25 @@ const getWebviewApi = (sdkReady) => {
   const multiApiLists = multiApi.api || [];
   multiApiLists.forEach((item) => {
     webviewBridge[item] = (...args) => {
-      return sdkReady.then(() => {
+      runWebviewApiMethod(() => {
         window[env][multiApi.keyName][item](...args);
-      })
+      });
     };
   });
   singleApi.forEach((item) => {
     webviewBridge[item] = (...args) => {
       if (env === 'web') {
-        return postMessage(item, ...args)
+        postMessage(item, ...args);
+      } else if (env === 'wx') {
+        runWebviewApiMethod(() => {
+          window[env] && window[env].ready(() => {
+            window[env][item](...args);
+          });
+        });
       } else {
-        return sdkReady.then(() => {
+        runWebviewApiMethod(() => {
           window[env][item](...args);
-        })
+        });
       }
     };
   });
diff --git a/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js b/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js
index 09068f4083..e1d26c2683 100644
--- a/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js
+++ b/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js
@@ -8,4 +8,4 @@
  * (c) 2023 @mpxjs team
  * @license Apache
  */
-const e={wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},ali:{url:"https://appx/web-view.min.js"},baidu:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://s3.pstatp.com/toutiao/tmajssdk/jssdk.js"},...window.sdkUrlMap};let o=null,a=0;const t={},n=navigator.userAgent;n.indexOf("AlipayClient")>-1?o="my":n.toLowerCase().indexOf("miniprogram")>-1?o=n.indexOf("QQ")>-1?"qq":"wx":n.indexOf("swan")>-1?o="swan":n.indexOf("toutiao")>-1?o="tt":(o="web",window.addEventListener("message",e=>{e.data.isMpxWebview&&(o="web",window.parent.postMessage({type:"load",detail:{load:!0}},"*"));const{callbackId:a,error:n,result:i}=e.data;void 0!==a&&t[a]&&(n?t[a](n):t[a](null,i),delete t[a])},!1));const i={config(e){if("wx"===o){if(window.wx){if(!e)return void console.log("\u5fae\u4fe1\u73af\u5883\u4e0b\u9700\u8981\u914d\u7f6ewx.config\u624d\u80fd\u6302\u8f7d\u65b9\u6cd5");window.wx.config(e)}}else console.log("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function s(e){if("[object Object]"!==Object.prototype.toString.call(e))return e;const o={};for(const a in e)"function"!=typeof e[a]&&(o[a]=e[a]);return o}const r=e=>{const n={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[o]||{},r={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation"]}[o]||{};(n.api||[]).forEach(a=>{i[a]=(...t)=>e.then(()=>{window[o][n.keyName][a](...t)})}),r.forEach(n=>{i[n]=(...i)=>"web"===o?function(e,o){if("getEnv"!==e){const n=++a;t[n]=(e,a)=>{e?(o.fail&&o.fail(e),o.complete&&o.complete(e)):(o.success&&o.success(a),o.complete&&o.complete(a)),delete t[n]},window.parent.postMessage&&window.parent.postMessage({type:e,callbackId:a,detail:{data:s(o)}},"*")}else o({miniprogram:!1})}(n,...i):e.then(()=>{window[o][n](...i)})})};(()=>{if(null===o)return console.log("mpxjs/webview: \u672a\u8bc6\u522b\u7684\u73af\u5883\uff0c\u5f53\u524d\u4ec5\u652f\u6301 \u5fae\u4fe1\u3001\u652f\u4ed8\u5b9d\u3001\u767e\u5ea6\u3001\u5934\u6761 QQ \u5c0f\u7a0b\u5e8f"),void r();const a=window[o]||"web"===o?Promise.resolve():e[o].url?function(e,{time:o=5e3,crossOrigin:a=!1}={}){return Promise.race([new Promise((o,t)=>{const n=document.createElement("script");n.type="text/javascript",n.async="async",a&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(o(),n.onload=n.onreadystatechange=null)},n.onerror=function(){t(new Error(`load ${e} error`)),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}),new Promise((a,t)=>{setTimeout(()=>{t(new Error(`load ${e} timeout`))},o)})])}(e[o].url,{crossOrigin:!!e[o].crossOrigin}):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk"));r(a)})();export default i;
\ No newline at end of file
+let e;const o={wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},ali:{url:"https://appx/web-view.min.js"},baidu:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://s3.pstatp.com/toutiao/tmajssdk/jssdk.js"},...window.sdkUrlMap};let a=null,t=0;const n={},i=navigator.userAgent;i.indexOf("AlipayClient")>-1?a="my":i.toLowerCase().indexOf("miniprogram")>-1?a=i.indexOf("QQ")>-1?"qq":"wx":i.indexOf("swan")>-1?a="swan":i.indexOf("toutiao")>-1?a="tt":(a="web",window.addEventListener("message",e=>{const{callbackId:o,error:a,result:t}=e.data;void 0!==o&&n[o]&&(a?n[o](a):n[o](null,t),delete n[o])},!1));let s=!1;function r(o){s?o():e.then(()=>{s=!0,o()})}const c={config(e){"wx"===a?r(()=>{window.wx&&window.wx.config(e)}):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function d(e){if("[object Object]"!==Object.prototype.toString.call(e))return e;const o={};for(const a in e)"function"!=typeof e[a]&&(o[a]=e[a]);return o}const g=()=>{const e={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[a]||{},o={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation"]}[a]||{};(e.api||[]).forEach(o=>{c[o]=(...t)=>{r(()=>{window[a][e.keyName][o](...t)})}}),o.forEach(e=>{c[e]=(...o)=>{"web"===a?function(e,o={}){if("getEnv"!==e){const a=++t;n[a]=(e,t)=>{e?(o.fail&&o.fail(e),o.complete&&o.complete(e)):(o.success&&o.success(t),o.complete&&o.complete(t)),delete n[a]},window.parent.postMessage&&window.parent.postMessage({type:e,callbackId:t,payload:d(o)},"*")}else o({webapp:!0})}(e,...o):r("wx"===a?()=>{window[a]&&window[a].ready(()=>{window[a][e](...o)})}:()=>{window[a][e](...o)})}})};e="web"!==a?o[a].url?function(e,{time:o=5e3,crossOrigin:a=!1}={}){return Promise.race([new Promise((o,t)=>{const n=document.createElement("script");n.type="text/javascript",n.async="async",a&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(o(),n.onload=n.onreadystatechange=null)},n.onerror=function(){t(new Error(`load ${e} error`)),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}),new Promise((a,t)=>{setTimeout(()=>{t(new Error(`load ${e} timeout`))},o)})])}(o[a].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),g();export default c;
\ No newline at end of file
diff --git a/packages/webview-bridge/dist/webviewbridge.esm.js b/packages/webview-bridge/dist/webviewbridge.esm.js
index d2d55f12c3..3bcb96a2c8 100644
--- a/packages/webview-bridge/dist/webviewbridge.esm.js
+++ b/packages/webview-bridge/dist/webviewbridge.esm.js
@@ -93,6 +93,7 @@ function loadScript(url) {
   return Promise.race([request(), timeout()]);
 }
 
+var sdkReady;
 var SDK_URL_MAP = _objectSpread2({
   wx: {
     url: 'https://res.wx.qq.com/open/js/jweixin-1.3.2.js'
@@ -126,16 +127,7 @@ if (systemUA.indexOf('AlipayClient') > -1) {
 } else {
   env = 'web';
   window.addEventListener('message', function (event) {
-    if (event.data.isMpxWebview) {
-      env = 'web';
-      window.parent.postMessage({
-        type: 'load',
-        detail: {
-          load: true
-        }
-      }, '*');
-    }
-    // 接收webview返回的数据location等
+    // 接收web-view的回调
     var _event$data = event.data,
       callbackId = _event$data.callbackId,
       error = _event$data.error,
@@ -150,22 +142,35 @@ if (systemUA.indexOf('AlipayClient') > -1) {
     }
   }, false);
 }
+var initWebviewBridge = function initWebviewBridge() {
+  sdkReady = env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve();
+  getWebviewApi();
+};
+var webviewSdkready = false;
+function runWebviewApiMethod(callback) {
+  if (webviewSdkready) {
+    callback();
+  } else {
+    sdkReady.then(function () {
+      webviewSdkready = true;
+      callback();
+    });
+  }
+}
 var webviewBridge = {
   config: function config(_config) {
     if (env !== 'wx') {
-      console.log('非微信环境不需要配置config');
+      console.warn('非微信环境不需要配置config');
       return;
     }
-    if (window.wx) {
-      if (!_config) {
-        console.log('微信环境下需要配置wx.config才能挂载方法');
-        return;
+    runWebviewApiMethod(function () {
+      if (window.wx) {
+        window.wx.config(_config);
       }
-      window.wx.config(_config);
-    }
+    });
   }
 };
-function mergeData(data) {
+function filterData(data) {
   if (Object.prototype.toString.call(data) !== '[object Object]') {
     return data;
   }
@@ -177,7 +182,8 @@ function mergeData(data) {
   }
   return newData;
 }
-function postMessage(type, data) {
+function postMessage(type) {
+  var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   if (type !== 'getEnv') {
     var currentCallbackId = ++callbackId;
     callbacks[currentCallbackId] = function (err, res) {
@@ -193,28 +199,15 @@ function postMessage(type, data) {
     window.parent.postMessage && window.parent.postMessage({
       type: type,
       callbackId: callbackId,
-      detail: {
-        data: mergeData(data)
-      }
+      payload: filterData(data)
     }, '*');
   } else {
     data({
-      miniprogram: false
+      webapp: true
     });
   }
 }
-var initWebviewBridge = function initWebviewBridge() {
-  if (env === null) {
-    console.log('mpxjs/webview: 未识别的环境，当前仅支持 微信、支付宝、百度、头条 QQ 小程序');
-    getWebviewApi();
-    return;
-  }
-  var sdkReady = !window[env] && env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url, {
-    crossOrigin: !!SDK_URL_MAP[env].crossOrigin
-  }) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve();
-  getWebviewApi(sdkReady);
-};
-var getWebviewApi = function getWebviewApi(sdkReady) {
+var getWebviewApi = function getWebviewApi() {
   var multiApiMap = {
     wx: {
       keyName: 'miniProgram',
@@ -247,7 +240,7 @@ var getWebviewApi = function getWebviewApi(sdkReady) {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
-      return sdkReady.then(function () {
+      runWebviewApiMethod(function () {
         var _window$env$multiApi$;
         (_window$env$multiApi$ = window[env][multiApi.keyName])[item].apply(_window$env$multiApi$, args);
       });
@@ -259,11 +252,18 @@ var getWebviewApi = function getWebviewApi(sdkReady) {
         args[_key2] = arguments[_key2];
       }
       if (env === 'web') {
-        return postMessage.apply(void 0, [item].concat(args));
+        postMessage.apply(void 0, [item].concat(args));
+      } else if (env === 'wx') {
+        runWebviewApiMethod(function () {
+          window[env] && window[env].ready(function () {
+            var _window$env;
+            (_window$env = window[env])[item].apply(_window$env, args);
+          });
+        });
       } else {
-        return sdkReady.then(function () {
-          var _window$env;
-          (_window$env = window[env])[item].apply(_window$env, args);
+        runWebviewApiMethod(function () {
+          var _window$env2;
+          (_window$env2 = window[env])[item].apply(_window$env2, args);
         });
       }
     };
diff --git a/packages/webview-bridge/dist/webviewbridge.js b/packages/webview-bridge/dist/webviewbridge.js
index e7dc3252a0..c87dba7eb4 100644
--- a/packages/webview-bridge/dist/webviewbridge.js
+++ b/packages/webview-bridge/dist/webviewbridge.js
@@ -99,6 +99,7 @@
     return Promise.race([request(), timeout()]);
   }
 
+  var sdkReady;
   var SDK_URL_MAP = _objectSpread2({
     wx: {
       url: 'https://res.wx.qq.com/open/js/jweixin-1.3.2.js'
@@ -132,16 +133,7 @@
   } else {
     env = 'web';
     window.addEventListener('message', function (event) {
-      if (event.data.isMpxWebview) {
-        env = 'web';
-        window.parent.postMessage({
-          type: 'load',
-          detail: {
-            load: true
-          }
-        }, '*');
-      }
-      // 接收webview返回的数据location等
+      // 接收web-view的回调
       var _event$data = event.data,
         callbackId = _event$data.callbackId,
         error = _event$data.error,
@@ -156,22 +148,35 @@
       }
     }, false);
   }
+  var initWebviewBridge = function initWebviewBridge() {
+    sdkReady = env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve();
+    getWebviewApi();
+  };
+  var webviewSdkready = false;
+  function runWebviewApiMethod(callback) {
+    if (webviewSdkready) {
+      callback();
+    } else {
+      sdkReady.then(function () {
+        webviewSdkready = true;
+        callback();
+      });
+    }
+  }
   var webviewBridge = {
     config: function config(_config) {
       if (env !== 'wx') {
-        console.log('非微信环境不需要配置config');
+        console.warn('非微信环境不需要配置config');
         return;
       }
-      if (window.wx) {
-        if (!_config) {
-          console.log('微信环境下需要配置wx.config才能挂载方法');
-          return;
+      runWebviewApiMethod(function () {
+        if (window.wx) {
+          window.wx.config(_config);
         }
-        window.wx.config(_config);
-      }
+      });
     }
   };
-  function mergeData(data) {
+  function filterData(data) {
     if (Object.prototype.toString.call(data) !== '[object Object]') {
       return data;
     }
@@ -183,7 +188,8 @@
     }
     return newData;
   }
-  function postMessage(type, data) {
+  function postMessage(type) {
+    var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     if (type !== 'getEnv') {
       var currentCallbackId = ++callbackId;
       callbacks[currentCallbackId] = function (err, res) {
@@ -199,28 +205,15 @@
       window.parent.postMessage && window.parent.postMessage({
         type: type,
         callbackId: callbackId,
-        detail: {
-          data: mergeData(data)
-        }
+        payload: filterData(data)
       }, '*');
     } else {
       data({
-        miniprogram: false
+        webapp: true
       });
     }
   }
-  var initWebviewBridge = function initWebviewBridge() {
-    if (env === null) {
-      console.log('mpxjs/webview: 未识别的环境，当前仅支持 微信、支付宝、百度、头条 QQ 小程序');
-      getWebviewApi();
-      return;
-    }
-    var sdkReady = !window[env] && env !== 'web' ? SDK_URL_MAP[env].url ? loadScript(SDK_URL_MAP[env].url, {
-      crossOrigin: !!SDK_URL_MAP[env].crossOrigin
-    }) : Promise.reject(new Error('未找到对应的sdk')) : Promise.resolve();
-    getWebviewApi(sdkReady);
-  };
-  var getWebviewApi = function getWebviewApi(sdkReady) {
+  var getWebviewApi = function getWebviewApi() {
     var multiApiMap = {
       wx: {
         keyName: 'miniProgram',
@@ -253,7 +246,7 @@
         for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
           args[_key] = arguments[_key];
         }
-        return sdkReady.then(function () {
+        runWebviewApiMethod(function () {
           var _window$env$multiApi$;
           (_window$env$multiApi$ = window[env][multiApi.keyName])[item].apply(_window$env$multiApi$, args);
         });
@@ -265,11 +258,18 @@
           args[_key2] = arguments[_key2];
         }
         if (env === 'web') {
-          return postMessage.apply(void 0, [item].concat(args));
+          postMessage.apply(void 0, [item].concat(args));
+        } else if (env === 'wx') {
+          runWebviewApiMethod(function () {
+            window[env] && window[env].ready(function () {
+              var _window$env;
+              (_window$env = window[env])[item].apply(_window$env, args);
+            });
+          });
         } else {
-          return sdkReady.then(function () {
-            var _window$env;
-            (_window$env = window[env])[item].apply(_window$env, args);
+          runWebviewApiMethod(function () {
+            var _window$env2;
+            (_window$env2 = window[env])[item].apply(_window$env2, args);
           });
         }
       };
diff --git a/packages/webview-bridge/dist/webviewbridge.min.js b/packages/webview-bridge/dist/webviewbridge.min.js
index 31e192d0d3..7c24aee855 100644
--- a/packages/webview-bridge/dist/webviewbridge.min.js
+++ b/packages/webview-bridge/dist/webviewbridge.min.js
@@ -8,4 +8,4 @@
  * (c) 2023 @mpxjs team
  * @license Apache
  */
-var e,t;e=this,t=function(){"use strict";function e(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function t(e,t,o){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var o=e[Symbol.toPrimitive];if(void 0!==o){var n=o.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}var o=function(o){for(var n=1;n<arguments.length;n++){var a=null!=arguments[n]?arguments[n]:{};n%2?e(Object(a),!0).forEach((function(e){t(o,e,a[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(a)):e(Object(a)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(a,e))}))}return o}({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},ali:{url:"https://appx/web-view.min.js"},baidu:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://s3.pstatp.com/toutiao/tmajssdk/jssdk.js"}},window.sdkUrlMap),n=null,a=0,r={},i=navigator.userAgent;i.indexOf("AlipayClient")>-1?n="my":i.toLowerCase().indexOf("miniprogram")>-1?n=i.indexOf("QQ")>-1?"qq":"wx":i.indexOf("swan")>-1?n="swan":i.indexOf("toutiao")>-1?n="tt":(n="web",window.addEventListener("message",(function(e){e.data.isMpxWebview&&(n="web",window.parent.postMessage({type:"load",detail:{load:!0}},"*"));var t=e.data,o=t.callbackId,a=t.error,i=t.result;void 0!==o&&r[o]&&(a?r[o](a):r[o](null,i),delete r[o])}),!1));var c={config:function(e){if("wx"===n){if(window.wx){if(!e)return void console.log("\u5fae\u4fe1\u73af\u5883\u4e0b\u9700\u8981\u914d\u7f6ewx.config\u624d\u80fd\u6302\u8f7d\u65b9\u6cd5");window.wx.config(e)}}else console.log("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function s(e){if("[object Object]"!==Object.prototype.toString.call(e))return e;var t={};for(var o in e)"function"!=typeof e[o]&&(t[o]=e[o]);return t}function p(e,t){if("getEnv"!==e){var o=++a;r[o]=function(e,n){e?(t.fail&&t.fail(e),t.complete&&t.complete(e)):(t.success&&t.success(n),t.complete&&t.complete(n)),delete r[o]},window.parent.postMessage&&window.parent.postMessage({type:e,callbackId:a,detail:{data:s(t)}},"*")}else t({miniprogram:!1})}var d=function(e){var t={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[n]||{},o={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation"]}[n]||{};(t.api||[]).forEach((function(o){c[o]=function(){for(var a=arguments.length,r=new Array(a),i=0;i<a;i++)r[i]=arguments[i];return e.then((function(){var e;(e=window[n][t.keyName])[o].apply(e,r)}))}})),o.forEach((function(t){c[t]=function(){for(var o=arguments.length,a=new Array(o),r=0;r<o;r++)a[r]=arguments[r];return"web"===n?p.apply(void 0,[t].concat(a)):e.then((function(){var e;(e=window[n])[t].apply(e,a)}))}}))};return function(){if(null===n)return console.log("mpxjs/webview: \u672a\u8bc6\u522b\u7684\u73af\u5883\uff0c\u5f53\u524d\u4ec5\u652f\u6301 \u5fae\u4fe1\u3001\u652f\u4ed8\u5b9d\u3001\u767e\u5ea6\u3001\u5934\u6761 QQ \u5c0f\u7a0b\u5e8f"),void d();var e=window[n]||"web"===n?Promise.resolve():o[n].url?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=t.time,n=void 0===o?5e3:o,a=t.crossOrigin,r=void 0!==a&&a;function i(){return new Promise((function(t,o){var n=document.createElement("script");n.type="text/javascript",n.async="async",r&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(t(),n.onload=n.onreadystatechange=null)},n.onerror=function(){o(new Error("load ".concat(e," error"))),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}))}function c(){return new Promise((function(t,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),n)}))}return Promise.race([i(),c()])}(o[n].url,{crossOrigin:!!o[n].crossOrigin}):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk"));d(e)}(),c},"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).mpx=t();
\ No newline at end of file
+var e,t;e=this,t=function(){"use strict";function e(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function t(e,t,o){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var o=e[Symbol.toPrimitive];if(void 0!==o){var n=o.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}var o,n=function(o){for(var n=1;n<arguments.length;n++){var a=null!=arguments[n]?arguments[n]:{};n%2?e(Object(a),!0).forEach((function(e){t(o,e,a[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(a)):e(Object(a)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(a,e))}))}return o}({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},ali:{url:"https://appx/web-view.min.js"},baidu:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://s3.pstatp.com/toutiao/tmajssdk/jssdk.js"}},window.sdkUrlMap),a=null,r=0,i={},c=navigator.userAgent;c.indexOf("AlipayClient")>-1?a="my":c.toLowerCase().indexOf("miniprogram")>-1?a=c.indexOf("QQ")>-1?"qq":"wx":c.indexOf("swan")>-1?a="swan":c.indexOf("toutiao")>-1?a="tt":(a="web",window.addEventListener("message",(function(e){var t=e.data,o=t.callbackId,n=t.error,a=t.result;void 0!==o&&i[o]&&(n?i[o](n):i[o](null,a),delete i[o])}),!1));var s=!1;function p(e){s?e():o.then((function(){s=!0,e()}))}var u={config:function(e){"wx"===a?p((function(){window.wx&&window.wx.config(e)})):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function d(e){if("[object Object]"!==Object.prototype.toString.call(e))return e;var t={};for(var o in e)"function"!=typeof e[o]&&(t[o]=e[o]);return t}function l(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if("getEnv"!==e){var o=++r;i[o]=function(e,n){e?(t.fail&&t.fail(e),t.complete&&t.complete(e)):(t.success&&t.success(n),t.complete&&t.complete(n)),delete i[o]},window.parent.postMessage&&window.parent.postMessage({type:e,callbackId:r,payload:d(t)},"*")}else t({webapp:!0})}var g=function(){var e={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[a]||{},t={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation"]}[a]||{};(e.api||[]).forEach((function(t){u[t]=function(){for(var o=arguments.length,n=new Array(o),r=0;r<o;r++)n[r]=arguments[r];p((function(){var o;(o=window[a][e.keyName])[t].apply(o,n)}))}})),t.forEach((function(e){u[e]=function(){for(var t=arguments.length,o=new Array(t),n=0;n<t;n++)o[n]=arguments[n];"web"===a?l.apply(void 0,[e].concat(o)):p("wx"===a?function(){window[a]&&window[a].ready((function(){var t;(t=window[a])[e].apply(t,o)}))}:function(){var t;(t=window[a])[e].apply(t,o)})}}))};return o="web"!==a?n[a].url?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=t.time,n=void 0===o?5e3:o,a=t.crossOrigin,r=void 0!==a&&a;function i(){return new Promise((function(t,o){var n=document.createElement("script");n.type="text/javascript",n.async="async",r&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(t(),n.onload=n.onreadystatechange=null)},n.onerror=function(){o(new Error("load ".concat(e," error"))),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}))}function c(){return new Promise((function(t,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),n)}))}return Promise.race([i(),c()])}(n[a].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),g(),u},"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).mpx=t();
\ No newline at end of file

From 6c3226d85f6d75f516c5f7c4d9b36e15b4cf3f53 Mon Sep 17 00:00:00 2001
From: Amorcy <yangcheng0113@163.com>
Date: Tue, 24 Oct 2023 16:46:20 +0800
Subject: [PATCH 23/35] chore: delete Player instance in Data

---
 .../lib/runtime/components/web/mpx-video.vue  | 54 +++++++++----------
 1 file changed, 26 insertions(+), 28 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
index 78493a7df9..2b9359f108 100755
--- a/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
+++ b/packages/webpack-plugin/lib/runtime/components/web/mpx-video.vue
@@ -129,7 +129,6 @@
     },
     data () {
       return {
-        player: null
       }
     },
     computed: {
@@ -145,7 +144,7 @@
   },
     watch: {
       muted: function (val) {
-        this.player?.muted(val)
+        this._player?.muted(val)
       },
       controls: function (show) {
         this.$emit('controlstoggle', inheritEvent('controlstoggle', {}, { show }))
@@ -153,7 +152,7 @@
     },
     mounted () {
       const videoNode = this.$refs['_mpx_video_ref']
-      this.player = videojs(videoNode, {
+      this._player = videojs(videoNode, {
         controls: true,
         sources:[
           {
@@ -174,83 +173,82 @@
     },
     methods: {
       initPlayer () {
-        this.player.muted(this.muted)
+        this._player.muted(this.muted)
         if (this.initialTime) {
-          this.player.currentTime(this.initialTime)
+          this._player.currentTime(this.initialTime)
         }
       },
       initStyle () {
-        if (!this.controls) this.player.el_.classList.add('mpx-no-show_controls')
+        if (!this.controls) this._player.el_.classList.add('mpx-no-show_controls')
 
-        if (!this.showBottomProgress) this.player.el_.classList.add('mpx-no-show_progress')
+        if (!this.showBottomProgress) this._player.el_.classList.add('mpx-no-show_progress')
 
         /**
           showProgress若不设置，宽度大于240时才会显示
         */
-        if (!this.showProgress || (this.player.el_.offsetWidth < 240 && this.showProgress)) this.player.el_.classList.add('mpx-no-show_progress')
+        if (!this.showProgress || (this._player.el_.offsetWidth < 240 && this.showProgress)) this._player.el_.classList.add('mpx-no-show_progress')
 
-        if (!this.showFullscreenBtn) this.player.el_.classList.add('mpx-no-show_fullscreen_btn')
+        if (!this.showFullscreenBtn) this._player.el_.classList.add('mpx-no-show_fullscreen_btn')
 
-        if (!this.showPlayBtn) this.player.el_.classList.add('mpx-no-show_play_btn')
+        if (!this.showPlayBtn) this._player.el_.classList.add('mpx-no-show_play_btn')
 
-        if (!this.showCenterPlayBtn) this.player.el_.classList.add('mpx-no-show_center_play_btn')
+        if (!this.showCenterPlayBtn) this._player.el_.classList.add('mpx-no-show_center_play_btn')
 
-        if (!this.showMuteBtn) this.player.el_.classList.add('mpx-no-show_mute_btn')
+        if (!this.showMuteBtn) this._player.el_.classList.add('mpx-no-show_mute_btn')
       },
       initEvent () {
-
-        this.player.on('play', (e) => {
+        this._player.on('play', (e) => {
           this.$emit('play', inheritEvent('play', e, {}))
         })
 
-        this.player.on('pause', (e) => {
+        this._player.on('pause', (e) => {
           this.$emit('pause', inheritEvent('pause', e, {}))
         })
 
-        this.player.on('ended', (e) => {
+        this._player.on('ended', (e) => {
           this.$emit('ended', inheritEvent('ended', e, {}))
         })
 
-        this.player.on('timeupdate', (e) => {
+        this._player.on('timeupdate', (e) => {
           this.$emit('timeupdate', inheritEvent('timeupdate', e, {}))
         })
 
-        this.player.on('error', (e) => {
+        this._player.on('error', (e) => {
           this.$emit('error', inheritEvent('error', e, {}))
         })
 
-        this.player.on('waiting', (e) => {
+        this._player.on('waiting', (e) => {
           this.$emit('waiting', inheritEvent('waiting', e, {}))
         })
-        this.player.on('loadedmetadata', (e) => {
+        this._player.on('loadedmetadata', (e) => {
           this.$emit('loadedmetadata', inheritEvent('loadedmetadata', e, {}))
         })
 
-        this.player.on('progress', (e) => {
+        this._player.on('progress', (e) => {
           const eNode = e.target
           const buffered = (eNode?.buffered?.end(0)) / (eNode?.duration)
           this.$emit('progress', inheritEvent('progress', e, { buffered: buffered * 100 }))
         })
 
-        this.player.on('seeked', (e) => {
+        this._player.on('seeked', (e) => {
           const eNode = e.target
           this.$emit('seekcomplete', inheritEvent('seekcomplete', e, { position: eNode.currentTime  }))
         })
-        this.player.on('fullscreenchange', (e) => {
-          if (!this.player.paused()) {
+        this._player.on('fullscreenchange', (e) => {
+          if (!this._player.paused()) {
             // hack: 解决退出全屏自动暂停
             setTimeout(() => {
-              this.player.play()
+              this._player.play()
             }, 500)
           }
-          this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: this.player.isFullscreen() }))
+          this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: this._player.isFullscreen() }))
         })
 
-        this.player.on('enterpictureinpicture', (e) => {
+        this._player.on('enterpictureinpicture', (e) => {
           this.$emit('enterpictureinpicture', inheritEvent('enterpictureinpicture', e, {}))
         })
 
-        this.player.on('leavepictureinpicture', (e) => {
+        this._player.on('leavepictureinpicture', (e) => {
           this.$emit('leavepictureinpicture', inheritEvent('leavepictureinpicture', e, {}))
         })
 

From f533e8035850c01d5e98fc748ee4d57f60ba9dba Mon Sep 17 00:00:00 2001
From: hiyuki <674883329@qq.com>
Date: Tue, 24 Oct 2023 18:40:30 +0800
Subject: [PATCH 24/35] v2.8.57

---
 lerna.json                           | 2 +-
 packages/webpack-plugin/package.json | 2 +-
 packages/webview-bridge/package.json | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/lerna.json b/lerna.json
index 768a35afab..0931925632 100644
--- a/lerna.json
+++ b/lerna.json
@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "2.8.56"
+  "version": "2.8.57"
 }
diff --git a/packages/webpack-plugin/package.json b/packages/webpack-plugin/package.json
index 61c9547921..eada5f3550 100644
--- a/packages/webpack-plugin/package.json
+++ b/packages/webpack-plugin/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.8.56",
+  "version": "2.8.57",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
diff --git a/packages/webview-bridge/package.json b/packages/webview-bridge/package.json
index a1b3cb0443..8e39963fca 100644
--- a/packages/webview-bridge/package.json
+++ b/packages/webview-bridge/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webview-bridge",
-  "version": "2.8.56",
+  "version": "2.8.57",
   "description": "a bridge for mpx webview",
   "author": "skyadmin",
   "license": "ISC",

From d987186ed12b7892583144b1a1293d810dd93768 Mon Sep 17 00:00:00 2001
From: yandadaFreedom <525966780@qq.com>
Date: Thu, 26 Oct 2023 11:49:32 +0800
Subject: [PATCH 25/35] =?UTF-8?q?fix:=20navigateBack=20delta=E5=A4=A7?=
 =?UTF-8?q?=E4=BA=8E=E7=8E=B0=E6=9C=89=E9=A1=B5=E9=9D=A2=E6=95=B0=E9=87=8F?=
 =?UTF-8?q?=E6=97=A0=E6=B3=95=E8=BF=94=E5=9B=9E=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/api-proxy/src/web/api/route/index.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/api-proxy/src/web/api/route/index.js b/packages/api-proxy/src/web/api/route/index.js
index 3410d67347..767a8b98cc 100644
--- a/packages/api-proxy/src/web/api/route/index.js
+++ b/packages/api-proxy/src/web/api/route/index.js
@@ -81,11 +81,15 @@ function navigateTo (options = {}) {
 function navigateBack (options = {}) {
   const router = global.__mpxRouter
   if (router) {
-    const delta = options.delta || 1
+    let delta = options.delta || 1
+    const stackLength = router.stack.length
     router.__mpxAction = {
       type: 'back',
       delta
     }
+    if (stackLength > 1 && delta >= stackLength) {
+      delta = stackLength - 1
+    }
     router.go(-delta)
     const res = { errMsg: 'navigateBack:ok' }
     webHandleSuccess(res, options.success, options.complete)

From 5252a6067e4213d4c3858d7249003ed9cb9ef4b9 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Thu, 26 Oct 2023 15:40:11 +0800
Subject: [PATCH 26/35] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=BE=93?=
 =?UTF-8?q?=E5=87=BAweb=EF=BC=8Cmpx.request=20datatype=3Dtext=E6=97=B6?=
 =?UTF-8?q?=E8=BF=94=E5=9B=9E=E5=80=BC=E4=B8=BAjson=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/api-proxy/src/web/api/request/index.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/api-proxy/src/web/api/request/index.js b/packages/api-proxy/src/web/api/request/index.js
index 28f3c43cfc..d0fd053f01 100644
--- a/packages/api-proxy/src/web/api/request/index.js
+++ b/packages/api-proxy/src/web/api/request/index.js
@@ -39,7 +39,17 @@ function request (options = { url: '' }) {
     headers: header,
     responseType,
     timeout,
-    cancelToken: source.token
+    cancelToken: source.token,
+    transitional: {
+      // silent JSON parsing mode
+      // `true`  - ignore JSON parsing errors and set response.data to null if parsing failed (old behaviour)
+      // `false` - throw SyntaxError if JSON parsing failed (Note: responseType must be set to 'json')
+      silentJSONParsing: true, // default value for the current Axios version
+      // try to parse the response string as JSON even if `responseType` is not 'json'
+      forcedJSONParsing: false,
+      // throw ETIMEDOUT error instead of generic ECONNABORTED on request timeouts
+      clarifyTimeoutError: false
+    }
   }
 
   if (method === 'GET') {

From 6dc4871723f51e333a8118f7b0b6b99db7183eef Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Thu, 26 Oct 2023 16:05:59 +0800
Subject: [PATCH 27/35] =?UTF-8?q?feat:=20=E5=A4=84=E7=90=86datatype?=
 =?UTF-8?q?=E4=B8=BAjson=EF=BC=8C=E8=BF=94=E5=9B=9Edata=E4=B8=BAstring?=
 =?UTF-8?q?=E5=9C=BA=E6=99=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/api-proxy/src/web/api/request/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/api-proxy/src/web/api/request/index.js b/packages/api-proxy/src/web/api/request/index.js
index d0fd053f01..905ebb27be 100644
--- a/packages/api-proxy/src/web/api/request/index.js
+++ b/packages/api-proxy/src/web/api/request/index.js
@@ -59,7 +59,7 @@ function request (options = { url: '' }) {
 
   const promise = axios(rOptions).then(res => {
     let data = res.data
-    if (responseType === 'text' && dataType === 'json') {
+    if (dataType === 'json' && typeof data === 'string') {
       try {
         data = JSON.parse(data)
       } catch (e) {

From 3143aad00535121c806d0f92da552d72cabd854f Mon Sep 17 00:00:00 2001
From: yandadaFreedom <525966780@qq.com>
Date: Thu, 26 Oct 2023 17:28:08 +0800
Subject: [PATCH 28/35] =?UTF-8?q?fix:=20=E4=BF=AE=E6=AD=A3delta?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/api-proxy/src/web/api/route/index.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/api-proxy/src/web/api/route/index.js b/packages/api-proxy/src/web/api/route/index.js
index 767a8b98cc..cfe75a22b5 100644
--- a/packages/api-proxy/src/web/api/route/index.js
+++ b/packages/api-proxy/src/web/api/route/index.js
@@ -83,13 +83,13 @@ function navigateBack (options = {}) {
   if (router) {
     let delta = options.delta || 1
     const stackLength = router.stack.length
+    if (stackLength > 1 && delta >= stackLength) {
+      delta = stackLength - 1
+    }
     router.__mpxAction = {
       type: 'back',
       delta
     }
-    if (stackLength > 1 && delta >= stackLength) {
-      delta = stackLength - 1
-    }
     router.go(-delta)
     const res = { errMsg: 'navigateBack:ok' }
     webHandleSuccess(res, options.success, options.complete)

From 42e08109b8890516ea12d47598f42e2c0a9f4682 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Thu, 26 Oct 2023 18:30:38 +0800
Subject: [PATCH 29/35] v2.8.58

---
 lerna.json                      | 2 +-
 packages/api-proxy/package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/lerna.json b/lerna.json
index 0931925632..fc6f2edacc 100644
--- a/lerna.json
+++ b/lerna.json
@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "2.8.57"
+  "version": "2.8.58"
 }
diff --git a/packages/api-proxy/package.json b/packages/api-proxy/package.json
index 09ea9d0c45..f517254b9f 100644
--- a/packages/api-proxy/package.json
+++ b/packages/api-proxy/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/api-proxy",
-  "version": "2.8.49",
+  "version": "2.8.58",
   "description": "convert miniprogram API at each end",
   "module": "src/index.js",
   "types": "@types/index.d.ts",

From 7facf2c626cae505fd5ad1cd9cc831da3d760eec Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Tue, 31 Oct 2023 16:09:38 +0800
Subject: [PATCH 30/35] =?UTF-8?q?feat:=20root-view=20=E6=96=B9=E6=A1=88?=
 =?UTF-8?q?=E5=9B=9E=E9=80=80=EF=BC=8C=E8=BE=93=E5=87=BAweb=E8=B5=B0v-on?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../platform/builtInMixins/proxyEventMixin.js |  34 +++---
 packages/webpack-plugin/lib/index.js          |   7 --
 .../lib/template-compiler/compiler.js         | 114 +++++++++++-------
 .../lib/template-compiler/index.js            |  11 +-
 .../webpack-plugin/lib/web/processTemplate.js |  11 --
 5 files changed, 84 insertions(+), 93 deletions(-)

diff --git a/packages/core/src/platform/builtInMixins/proxyEventMixin.js b/packages/core/src/platform/builtInMixins/proxyEventMixin.js
index bb32562c1f..55128b3ea5 100644
--- a/packages/core/src/platform/builtInMixins/proxyEventMixin.js
+++ b/packages/core/src/platform/builtInMixins/proxyEventMixin.js
@@ -89,34 +89,30 @@ export default function proxyEventMixin () {
   }
   if (__mpx_mode__ === 'ali') {
     Object.assign(methods, {
-      triggerEvent (eventName, eventDetail, e) {
+      triggerEvent (eventName, eventDetail) {
         const handlerName = eventName.replace(/^./, matched => matched.toUpperCase()).replace(/-([a-z])/g, (match, p1) => p1.toUpperCase())
         const handler = this.props && (this.props['on' + handlerName] || this.props['catch' + handlerName])
         if (handler && typeof handler === 'function') {
-          let eventObj = {}
-          if (e) {
-            e.detail = Object.assign(e.detail, eventDetail)
-            eventObj = e
-          } else {
-            const dataset = collectDataset(this.props)
-            const id = this.props.id || ''
-            const timeStamp = +new Date()
-            eventObj = {
-              type: eventName,
-              timeStamp,
-              target: { id, dataset, targetDataset: dataset },
-              currentTarget: { id, dataset },
-              detail: eventDetail
-            }
+          const dataset = collectDataset(this.props)
+          const id = this.props.id || ''
+          const timeStamp = +new Date()
+          const target = { id, dataset, targetDataset: dataset }
+          const currentTarget = { id, dataset }
+          const detail = eventDetail
+          const eventObj = {
+            type: eventName,
+            timeStamp,
+            target,
+            currentTarget,
+            detail
           }
           handler.call(this, eventObj)
         }
       },
       __proxyEvent (e) {
-        const eventName = e.type
         // 保持和微信一致
-        e.target = e.currentTarget
-        this.triggerEvent(eventName, {}, e)
+        // e.target = e.currentTarget
+        this.triggerEvent(e.type, e.detail)
       }
     })
   }
diff --git a/packages/webpack-plugin/lib/index.js b/packages/webpack-plugin/lib/index.js
index 8d019cb710..5ab77c7912 100644
--- a/packages/webpack-plugin/lib/index.js
+++ b/packages/webpack-plugin/lib/index.js
@@ -173,12 +173,6 @@ class MpxWebpackPlugin {
     options.retryRequireAsync = options.retryRequireAsync || false
     options.enableAliRequireAsync = options.enableAliRequireAsync || false
     options.optimizeSize = options.optimizeSize || false
-    let proxyComponentEventsRules = []
-    const proxyComponentEventsRulesRaw = options.proxyComponentEventsRules
-    if (proxyComponentEventsRulesRaw) {
-      proxyComponentEventsRules = Array.isArray(proxyComponentEventsRulesRaw) ? proxyComponentEventsRulesRaw : [proxyComponentEventsRulesRaw]
-    }
-    options.proxyComponentEventsRules = proxyComponentEventsRules
     this.options = options
     // Hack for buildDependencies
     const rawResolveBuildDependencies = FileSystemInfo.prototype.resolveBuildDependencies
@@ -646,7 +640,6 @@ class MpxWebpackPlugin {
           enableRequireAsync: this.options.mode === 'wx' || (this.options.mode === 'ali' && this.options.enableAliRequireAsync),
           partialCompile: this.options.partialCompile,
           asyncSubpackageRules: this.options.asyncSubpackageRules,
-          proxyComponentEventsRules: this.options.proxyComponentEventsRules,
           pathHash: (resourcePath) => {
             if (this.options.pathHashMode === 'relative' && this.options.projectRoot) {
               return hash(path.relative(this.options.projectRoot, resourcePath))
diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js
index ae00c3bda3..69a45056a6 100644
--- a/packages/webpack-plugin/lib/template-compiler/compiler.js
+++ b/packages/webpack-plugin/lib/template-compiler/compiler.js
@@ -3,6 +3,7 @@ const he = require('he')
 const config = require('../config')
 const { MPX_ROOT_VIEW, MPX_APP_MODULE_ID } = require('../utils/const')
 const normalize = require('../utils/normalize')
+const { normalizeCondition } = require('../utils/match-condition')
 const isValidIdentifierStr = require('../utils/is-valid-identifier-str')
 const isEmptyObject = require('../utils/is-empty-object')
 const getRulesRunner = require('../platform/index')
@@ -1750,47 +1751,67 @@ function processBuiltInComponents (el, meta) {
   }
 }
 
-function processRootViewEventHack (el, options, root) {
-  // 只处理组件根节点
-  if (!(options.isComponent && el === root && isRealNode(el))) {
-    return
-  }
-  const { proxyComponentEvents } = options
-  if (proxyComponentEvents) {
-    proxyComponentEvents.forEach((type) => {
-      addAttrs(el, [{
-        name: type,
-        value: '__proxyEvent'
-      }])
-    })
+function processAliAddComponentRootView (el, options) {
+  const processAttrsConditions = [
+    { condition: /^(on|catch)Tap$/, action: 'clone' },
+    { condition: /^(on|catch)TouchStart$/, action: 'clone' },
+    { condition: /^(on|catch)TouchMove$/, action: 'clone' },
+    { condition: /^(on|catch)TouchEnd$/, action: 'clone' },
+    { condition: /^(on|catch)TouchCancel$/, action: 'clone' },
+    { condition: /^(on|catch)LongTap$/, action: 'clone' },
+    { condition: /^data-/, action: 'clone' },
+    { condition: /^style$/, action: 'move' },
+    { condition: /^slot$/, action: 'move' }
+  ]
+  const processAppendAttrsRules = [
+    { name: 'class', value: `${MPX_ROOT_VIEW} host-${options.moduleId}` }
+  ]
+  const newElAttrs = []
+  const allAttrs = cloneAttrsList(el.attrsList)
+
+  function processClone (attr) {
+    newElAttrs.push(attr)
   }
-}
 
-function processRootViewStyleClassHack (el, options, root) {
-  // 处理组件根节点
-  if (options.isComponent && el === root && isRealNode(el)) {
-    const processor = ({ name, value, typeName }) => {
-      const sep = name === 'style' ? ';' : ' '
-      value = value ? `{{${typeName}||''}}${sep}${value}` : `{{${typeName}||''}}`
-      return [name, value]
-    }
+  function processMove (attr) {
+    getAndRemoveAttr(el, attr.name)
+    newElAttrs.push(attr)
+  }
 
-    ['style', 'class'].forEach((type) => {
-      const exp = getAndRemoveAttr(el, type).val
-      const typeName = type === 'class' ? 'className' : type
-      const [newName, newValue] = processor({
-        name: type,
-        value: exp,
-        typeName
+  function processAppendRules (el) {
+    processAppendAttrsRules.forEach((rule) => {
+      const getNeedAppendAttrValue = el.attrsMap[rule.name]
+      const value = getNeedAppendAttrValue ? getNeedAppendAttrValue + ' ' + rule.value : rule.value
+      newElAttrs.push({
+        name: rule.name,
+        value
       })
-      if (newValue !== undefined) {
-        addAttrs(el, [{
-          name: newName,
-          value: newValue
-        }])
+    })
+  }
+
+  processAttrsConditions.forEach(item => {
+    const matcher = normalizeCondition(item.condition)
+    allAttrs.forEach((attr) => {
+      if (matcher(attr.name)) {
+        if (item.action === 'clone') {
+          processClone(attr)
+        } else if (item.action === 'move') {
+          processMove(attr)
+        }
       }
     })
+  })
+
+  processAppendRules(el)
+  const componentWrapView = createASTElement('view', newElAttrs)
+  moveBaseDirective(componentWrapView, el)
+  if (el.is && el.components) {
+    el = postProcessComponentIs(el)
   }
+
+  replaceNode(el, componentWrapView, true)
+  addChild(componentWrapView, el)
+  return componentWrapView
 }
 
 // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。
@@ -1802,14 +1823,19 @@ function getVirtualHostRoot (options, meta) {
       !meta.options && (meta.options = {})
       meta.options.virtualHost = true
     }
-    if ((mode === 'ali' || mode === 'web') && !options.hasVirtualHost) {
+    if ((mode === 'web') && !options.hasVirtualHost) {
       // ali组件根节点实体化
       const rootView = createASTElement('view', [
         {
           name: 'class',
           value: `${MPX_ROOT_VIEW} host-${options.moduleId}`
+        },
+        {
+          name: 'v-on',
+          value: '$listeners'
         }
       ])
+      rootView.hasEvent = true
       processElement(rootView, rootView, options, meta)
       return rootView
     }
@@ -1991,16 +2017,6 @@ function processMpxTagName (el) {
 }
 
 function processElement (el, root, options, meta) {
-  const transAli = mode === 'ali' && srcMode === 'wx'
-  const transWeb = mode === 'web' && srcMode === 'wx'
-  if (transAli) {
-    processRootViewStyleClassHack(el, options, root)
-    processRootViewEventHack(el, options, root)
-  }
-  if (transWeb) {
-    processRootViewEventHack(el, options, root)
-  }
-
   processAtMode(el)
   // 如果已经标记了这个元素要被清除，直接return跳过后续处理步骤
   if (el._atModeStatus === 'mismatch') {
@@ -2020,6 +2036,8 @@ function processElement (el, root, options, meta) {
 
   processInjectWxs(el, meta)
 
+  const transAli = mode === 'ali' && srcMode === 'wx'
+
   if (mode === 'web') {
     // 收集内建组件
     processBuiltInComponents(el, meta)
@@ -2071,7 +2089,11 @@ function closeElement (el, meta, options) {
   postProcessWxs(el, meta)
 
   if (!pass) {
-    el = postProcessComponentIs(el)
+    if (isComponentNode(el, options) && !options.hasVirtualHost && mode === 'ali') {
+      el = processAliAddComponentRootView(el, options)
+    } else {
+      el = postProcessComponentIs(el)
+    }
   }
   postProcessFor(el)
   postProcessIf(el)
diff --git a/packages/webpack-plugin/lib/template-compiler/index.js b/packages/webpack-plugin/lib/template-compiler/index.js
index 5253de95ea..fddd7365ac 100644
--- a/packages/webpack-plugin/lib/template-compiler/index.js
+++ b/packages/webpack-plugin/lib/template-compiler/index.js
@@ -40,14 +40,6 @@ module.exports = function (raw) {
     )
   }
 
-  let proxyComponentEvents = null
-  for (const item of mpx.proxyComponentEventsRules) {
-    if (matchCondition(resourcePath, item)) {
-      const eventsRaw = item.events
-      proxyComponentEvents = Array.isArray(eventsRaw) ? eventsRaw : [eventsRaw]
-      break
-    }
-  }
   const { root: ast, meta } = compiler.parse(raw, {
     warn,
     error,
@@ -70,8 +62,7 @@ module.exports = function (raw) {
     checkUsingComponents: matchCondition(resourcePath, mpx.checkUsingComponentsRules),
     globalComponents: Object.keys(mpx.usingComponents),
     forceProxyEvent: matchCondition(resourcePath, mpx.forceProxyEventRules),
-    hasVirtualHost: matchCondition(resourcePath, mpx.autoVirtualHostRules),
-    proxyComponentEvents
+    hasVirtualHost: matchCondition(resourcePath, mpx.autoVirtualHostRules)
   })
 
   if (meta.wxsContentMap) {
diff --git a/packages/webpack-plugin/lib/web/processTemplate.js b/packages/webpack-plugin/lib/web/processTemplate.js
index 618d01cc1d..48e06c3f83 100644
--- a/packages/webpack-plugin/lib/web/processTemplate.js
+++ b/packages/webpack-plugin/lib/web/processTemplate.js
@@ -23,7 +23,6 @@ module.exports = function (template, {
     decodeHTMLText,
     externalClasses,
     checkUsingComponents,
-    proxyComponentEventsRules,
     autoVirtualHostRules
   } = mpx
   const { resourcePath } = parseRequest(loaderContext.resource)
@@ -58,15 +57,6 @@ module.exports = function (template, {
       if (template.content) {
         const templateSrcMode = template.mode || srcMode
 
-        let proxyComponentEvents = null
-        for (const item of proxyComponentEventsRules) {
-          if (matchCondition(resourcePath, item)) {
-            const eventsRaw = item.events
-            proxyComponentEvents = Array.isArray(eventsRaw) ? eventsRaw : [eventsRaw]
-            break
-          }
-        }
-
         const { root, meta } = templateCompiler.parse(template.content, {
           warn: (msg) => {
             loaderContext.emitWarning(
@@ -97,7 +87,6 @@ module.exports = function (template, {
           globalComponents: [],
           // web模式下实现抽象组件
           componentGenerics,
-          proxyComponentEvents,
           hasVirtualHost: matchCondition(resourcePath, autoVirtualHostRules)
         })
         if (meta.wxsModuleMap) {

From 1e0372f9156309627fb20a7e7b4f4620e69090d0 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Tue, 31 Oct 2023 16:14:44 +0800
Subject: [PATCH 31/35] =?UTF-8?q?feat:=E8=BE=93=E5=87=BAweb=20page?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0root-view=E8=8A=82=E7=82=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/webpack-plugin/lib/template-compiler/compiler.js | 8 ++++++++
 packages/webpack-plugin/lib/web/processTemplate.js        | 1 +
 2 files changed, 9 insertions(+)

diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js
index 69a45056a6..9b234f7025 100644
--- a/packages/webpack-plugin/lib/template-compiler/compiler.js
+++ b/packages/webpack-plugin/lib/template-compiler/compiler.js
@@ -1840,6 +1840,14 @@ function getVirtualHostRoot (options, meta) {
       return rootView
     }
   }
+  if (srcMode === 'wx' && mode === 'web' && options.isPage) {
+    return createASTElement('div', [
+      {
+        name: 'class',
+        value: 'mpx-root-view'
+      }
+    ])
+  }
   return getTempNode()
 }
 
diff --git a/packages/webpack-plugin/lib/web/processTemplate.js b/packages/webpack-plugin/lib/web/processTemplate.js
index 48e06c3f83..d46501906d 100644
--- a/packages/webpack-plugin/lib/web/processTemplate.js
+++ b/packages/webpack-plugin/lib/web/processTemplate.js
@@ -72,6 +72,7 @@ module.exports = function (template, {
           hasComment,
           isNative,
           isComponent: ctorType === 'component',
+          isPage: ctorType === 'page',
           mode,
           srcMode: templateSrcMode,
           defs,

From 74da96862bbf1d0d4d813f18adf975f97f8f96db Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Tue, 31 Oct 2023 17:22:41 +0800
Subject: [PATCH 32/35] =?UTF-8?q?=E8=BE=93=E5=87=BA=E6=94=AF=E4=BB=98?=
 =?UTF-8?q?=E5=AE=9D=E8=8A=82=E7=82=B9id=20clone=E8=87=B3=E5=8C=85?=
 =?UTF-8?q?=E8=A3=B9=E8=8A=82=E7=82=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/webpack-plugin/lib/template-compiler/compiler.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js
index 9b234f7025..6d092bac7e 100644
--- a/packages/webpack-plugin/lib/template-compiler/compiler.js
+++ b/packages/webpack-plugin/lib/template-compiler/compiler.js
@@ -1760,6 +1760,7 @@ function processAliAddComponentRootView (el, options) {
     { condition: /^(on|catch)TouchCancel$/, action: 'clone' },
     { condition: /^(on|catch)LongTap$/, action: 'clone' },
     { condition: /^data-/, action: 'clone' },
+    { condition: /^id$/, action: 'clone' },
     { condition: /^style$/, action: 'move' },
     { condition: /^slot$/, action: 'move' }
   ]

From d9efabf42d5985a4bac899a212b6c84250896d54 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Tue, 31 Oct 2023 17:28:16 +0800
Subject: [PATCH 33/35] =?UTF-8?q?fix:=E5=88=A0=E9=99=A4proxyComponentEvent?=
 =?UTF-8?q?s=E9=85=8D=E7=BD=AE=E6=96=87=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs-vuepress/api/compile.md | 47 ------------------------------------
 1 file changed, 47 deletions(-)

diff --git a/docs-vuepress/api/compile.md b/docs-vuepress/api/compile.md
index 2ef97433a5..6676a80c1a 100644
--- a/docs-vuepress/api/compile.md
+++ b/docs-vuepress/api/compile.md
@@ -1565,53 +1565,6 @@ module.exports = defineConfig({
 })
 ```
 
-### proxyComponentEventsRules
-
-- **类型**：`Array<Object> | Object`
-  - `option.include` 同webpack的include规则
-  - `option.exclude` 同webpack的exclude规则
-  - `option.events` 需要在支付宝环境代理的事件，数组形式的支付宝事件名，例如['onTap', 'onTouchMove']
-  
-在微信小程序中，自定义组件本身的那个节点是一个“普通”的节点，使用时可以在这个节点上设置 class style、事件、 flex 布局等，就如同普通的 view 组件节点一样。
-
-在支付宝平台下，自定义组件节点默认是虚拟节点，会展示自定义组件内部的第一层节点，自定义组件节点本身设置的 class style 等不会生效。
-
-跨端输出支付宝时，当自定义组件未开启 virtualHost 时，为了保持和微信一直，Mpx 框架会在自定义组件根节点包裹添加一个 view 节点来保持和微信一致，并将用户在自定义组件节点上设置的
-style、class、绑定事件等 copy 至包裹节点，对于事件来说，由于在编译自定义组件时，我们无法感知外部父组件是否绑定事件，我们不能无脑给所有自定义组件包裹节点都绑定上小程序的事件监听，
-这样会导致整体运行时开销很大，因此当你需要在支付宝环境中自定义组件根节点上绑定事件时，需要通过次配置来告诉框架需要帮你代理抹平哪些事件。
-
-跨端输出Web时，为了和微信小程序保持一致，在非virtualHost的自定义组件节点上，默认也会插入一个包裹节点，同理对于事件的代理也需要用户进行配置告诉框架来对哪些自定义组件的哪些事件进行代理。
-
-当我们在小程序开发时存在以下代码时
-```html
-<!--自定义组件list-->
-<!--src/packageA/pages/index.mpx-->
-<list bindtap="tapHandler"></list>
-```
-支付宝环境的自定义组件节点绑定事件并不会触发，但微信环境可以，若想在支付宝环境下使用该功能，则需配置此规则
-```js
-const path = require('path')
-
-new MpxWebpackPlugin({
-  proxyComponentEventsRules: [
-    {
-      include: path.resolve('src/packageA'), // 输出支付宝时，对src/packageA文件夹中的所有自定义组件添加 onTap, onToucheMove 事件代理
-      exclude: path.resolve('lib'),
-      events: ['bindtap', 'bindtouchstart']
-    },
-    {
-      include: path.resolve('src/packageB'), // 输出支付宝时，对src/packageB文件夹中的所有自定义组件添加 onTap, onLongTap 事件代理
-      events: ['bindtap']
-    },
-  ]
-})
-```
-
-需要注意的是，所有的事件名配置，我们以微信事件为基准，例如虽然你是跨端输出支付宝，也请配置bindtap，而不是onTap。
-
-请注意，在跨端输出 Web 时，只支持配置 tap 、longtap、longpress 这三个事件代理，且最好不要同时配置了两个事件，不然有可能会导致同一个事件触发两次。
-
-
 ## MpxWebpackPlugin static methods
 
 `MpxWebpackPlugin` 通过静态方法暴露了以下五个内置 loader，详情如下：

From 61970d8ac4fb338fa02f9029801b5a6e860aaa85 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Tue, 31 Oct 2023 17:59:44 +0800
Subject: [PATCH 34/35] =?UTF-8?q?fix:=20=E5=88=A0=E9=99=A4proxyEvent=20?=
 =?UTF-8?q?=E4=BA=8B=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../platform/builtInMixins/proxyEventMixin.js | 14 +++--------
 .../builtInMixins/proxyEventMixin.web.js      |  6 -----
 packages/core/src/vuePlugin.js                | 25 ++++++++-----------
 3 files changed, 13 insertions(+), 32 deletions(-)

diff --git a/packages/core/src/platform/builtInMixins/proxyEventMixin.js b/packages/core/src/platform/builtInMixins/proxyEventMixin.js
index 55128b3ea5..e0d409e579 100644
--- a/packages/core/src/platform/builtInMixins/proxyEventMixin.js
+++ b/packages/core/src/platform/builtInMixins/proxyEventMixin.js
@@ -96,23 +96,15 @@ export default function proxyEventMixin () {
           const dataset = collectDataset(this.props)
           const id = this.props.id || ''
           const timeStamp = +new Date()
-          const target = { id, dataset, targetDataset: dataset }
-          const currentTarget = { id, dataset }
-          const detail = eventDetail
           const eventObj = {
             type: eventName,
             timeStamp,
-            target,
-            currentTarget,
-            detail
+            target: { id, dataset, targetDataset: dataset },
+            currentTarget: { id, dataset },
+            detail: eventDetail
           }
           handler.call(this, eventObj)
         }
-      },
-      __proxyEvent (e) {
-        // 保持和微信一致
-        // e.target = e.currentTarget
-        this.triggerEvent(e.type, e.detail)
       }
     })
   }
diff --git a/packages/core/src/platform/builtInMixins/proxyEventMixin.web.js b/packages/core/src/platform/builtInMixins/proxyEventMixin.web.js
index 02cbc8eb34..62cd045032 100644
--- a/packages/core/src/platform/builtInMixins/proxyEventMixin.web.js
+++ b/packages/core/src/platform/builtInMixins/proxyEventMixin.web.js
@@ -18,12 +18,6 @@ export default function proxyEventMixin () {
         const originValue = valuePath.reduce((acc, cur) => acc[cur], $event.detail)
         const value = filterMethod ? (innerFilter[filterMethod] ? innerFilter[filterMethod](originValue) : typeof this[filterMethod] === 'function' && this[filterMethod]) : originValue
         setByPath(this, expr, value)
-      },
-      __proxyEvent (e) {
-        const type = e.type
-        // 保持和微信一致 target 和 currentTarget 相同
-        e.target = e.currentTarget
-        this.triggerEvent(type, {}, e)
       }
     }
   }
diff --git a/packages/core/src/vuePlugin.js b/packages/core/src/vuePlugin.js
index 758801cf64..9c580ee4ed 100644
--- a/packages/core/src/vuePlugin.js
+++ b/packages/core/src/vuePlugin.js
@@ -16,22 +16,17 @@ function collectDataset (attrs) {
 }
 
 export default function install (Vue) {
-  Vue.prototype.triggerEvent = function (eventName, eventDetail, e) {
+  Vue.prototype.triggerEvent = function (eventName, eventDetail) {
     let eventObj = {}
-    if (e) {
-      e.detail = Object.assign(e.detail, eventDetail)
-      eventObj = e
-    } else {
-      const dataset = collectDataset(this.$attrs)
-      const id = this.$attrs.id || ''
-      const timeStamp = +new Date()
-      eventObj = {
-        type: eventName,
-        timeStamp,
-        target: { id, dataset, targetDataset: dataset },
-        currentTarget: { id, dataset },
-        detail: eventDetail
-      }
+    const dataset = collectDataset(this.$attrs)
+    const id = this.$attrs.id || ''
+    const timeStamp = +new Date()
+    eventObj = {
+      type: eventName,
+      timeStamp,
+      target: { id, dataset, targetDataset: dataset },
+      currentTarget: { id, dataset },
+      detail: eventDetail
     }
     return this.$emit(eventName, eventObj)
   }

From 867a1c3727047c4d70ac385985516d54921431a7 Mon Sep 17 00:00:00 2001
From: xuegan <xuegan@didiglobal.com>
Date: Wed, 1 Nov 2023 17:04:16 +0800
Subject: [PATCH 35/35] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E9=83=A8?=
 =?UTF-8?q?=E5=88=86=E9=80=BB=E8=BE=91=E6=A0=BC=E5=BC=8F=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lib/template-compiler/compiler.js         | 63 ++++++++++---------
 .../lib/template-compiler/index.js            |  2 +
 2 files changed, 35 insertions(+), 30 deletions(-)

diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js
index 6d092bac7e..8e2bb9a1d8 100644
--- a/packages/webpack-plugin/lib/template-compiler/compiler.js
+++ b/packages/webpack-plugin/lib/template-compiler/compiler.js
@@ -1817,37 +1817,40 @@ function processAliAddComponentRootView (el, options) {
 
 // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。
 function getVirtualHostRoot (options, meta) {
-  if (srcMode === 'wx' && options.isComponent) {
-    // 处理组件时
-    if (mode === 'wx' && options.hasVirtualHost) {
-      // wx组件注入virtualHost配置
-      !meta.options && (meta.options = {})
-      meta.options.virtualHost = true
-    }
-    if ((mode === 'web') && !options.hasVirtualHost) {
-      // ali组件根节点实体化
-      const rootView = createASTElement('view', [
-        {
-          name: 'class',
-          value: `${MPX_ROOT_VIEW} host-${options.moduleId}`
-        },
-        {
-          name: 'v-on',
-          value: '$listeners'
-        }
-      ])
-      rootView.hasEvent = true
-      processElement(rootView, rootView, options, meta)
-      return rootView
-    }
-  }
-  if (srcMode === 'wx' && mode === 'web' && options.isPage) {
-    return createASTElement('div', [
-      {
-        name: 'class',
-        value: 'mpx-root-view'
+  if (srcMode === 'wx') {
+    if (options.isComponent) {
+      if ((mode === 'wx') && options.hasVirtualHost) {
+        // wx组件注入virtualHost配置
+        !meta.options && (meta.options = {})
+        meta.options.virtualHost = true
+      }
+      if ((mode === 'web') && !options.hasVirtualHost) {
+        // ali组件根节点实体化
+        const rootView = createASTElement('view', [
+          {
+            name: 'class',
+            value: `${MPX_ROOT_VIEW} host-${options.moduleId}`
+          },
+          {
+            name: 'v-on',
+            value: '$listeners'
+          }
+        ])
+        rootView.hasEvent = true
+        processElement(rootView, rootView, options, meta)
+        return rootView
+      }
+    }
+    if (options.isPage) {
+      if (mode === 'web') {
+        return createASTElement('div', [
+          {
+            name: 'class',
+            value: 'page'
+          }
+        ])
       }
-    ])
+    }
   }
   return getTempNode()
 }
diff --git a/packages/webpack-plugin/lib/template-compiler/index.js b/packages/webpack-plugin/lib/template-compiler/index.js
index fddd7365ac..986352c90e 100644
--- a/packages/webpack-plugin/lib/template-compiler/index.js
+++ b/packages/webpack-plugin/lib/template-compiler/index.js
@@ -19,6 +19,7 @@ module.exports = function (raw) {
   const localSrcMode = queryObj.mode
   const packageName = queryObj.packageRoot || mpx.currentPackageRoot || 'main'
   const componentsMap = mpx.componentsMap[packageName]
+  const pagesMap = mpx.pagesMap
   const wxsContentMap = mpx.wxsContentMap
   const renderOptimizeRules = mpx.renderOptimizeRules
   const usingComponents = queryObj.usingComponents || []
@@ -48,6 +49,7 @@ module.exports = function (raw) {
     hasComment,
     isNative,
     isComponent: !!componentsMap[resourcePath],
+    isPage: !!pagesMap[resourcePath],
     mode,
     env,
     srcMode: localSrcMode || globalSrcMode,