@mpxjs/webpack-plugin 2.8.35 → 2.8.37

package/lib/index.js

@@ -432,9 +432,9 @@ class MpxWebpackPlugin {
           mpx.staticResourcesMap[packageRoot] = mpx.staticResourcesMap[packageRoot] || {}
           mpx.subpackageModulesMap[packageRoot] = mpx.subpackageModulesMap[packageRoot] || {}
           async.each(deps, (dep, callback) => {
-            dep.addEntry(compilation, (err, { resultPath }) => {
+            dep.addEntry(compilation, (err, result) => {
               if (err) return callback(err)
-              dep.resultPath = mpx.replacePathMap[dep.key] = resultPath
+              dep.resultPath = mpx.replacePathMap[dep.key] = result.resultPath
               callback()
             })
           }, callback)
@@ -453,7 +453,8 @@ class MpxWebpackPlugin {
       name: 'MpxWebpackPlugin',
       stage: -1000
     }, (compilation, callback) => {
-      processSubpackagesEntriesMap(compilation, () => {
+      processSubpackagesEntriesMap(compilation, (err) => {
+        if (err) return callback(err)
         const checkRegisterPack = () => {
           for (const packRoot in mpx.dynamicEntryInfo) {
             const entryMap = mpx.dynamicEntryInfo[packRoot]

package/lib/runtime/components/web/getInnerListeners.js

@@ -144,11 +144,25 @@ export function inheritEvent (type, oe, detail = {}) {
 }
 
 export function getCustomEvent (type, detail = {}, target = null) {
+  const targetInfo = {}
+  if (target) {
+    const targetEl = target.$el || {}
+    const info = {
+      id: targetEl.id || '',
+      dataset: targetEl.dataset || {},
+      offsetTop: targetEl.offsetTop || 0,
+      offsetLeft: targetEl.offsetLeft || 0
+    }
+    Object.assign(targetInfo, {
+      target: info,
+      currentTarget: info
+    })
+  }
   return {
     type,
     detail,
-    target,
-    timeStamp: new Date().valueOf()
+    timeStamp: new Date().valueOf(),
+    ...targetInfo
   }
 }
 

package/lib/runtime/components/web/mpx-checkbox-group.vue

@@ -79,7 +79,7 @@
         } else {
           value = this.getValue()
         }
-        this.$emit('change', getCustomEvent('change', { value }, this.$refs.checkboxGroup))
+        this.$emit('change', getCustomEvent('change', { value }, this))
       }
     }
   }

package/lib/runtime/components/web/mpx-form.vue

@@ -76,11 +76,11 @@
     methods: {
       submit () {
         const value = getFormValue(this.$slots.default)
-        this.$emit('submit', getCustomEvent('submit', { value }))
+        this.$emit('submit', getCustomEvent('submit', { value }, this))
       },
       reset () {
         setFormValue(this.$slots.default, this.initialValue)
-        this.$emit('reset', getCustomEvent('reset', { value: this.initialValue }))
+        this.$emit('reset', getCustomEvent('reset', { value: this.initialValue }, this))
       }
     }
   }

package/lib/runtime/components/web/mpx-image.vue

@@ -1,5 +1,5 @@
 <script>
-  import getInnerListeners, { extendEvent } from './getInnerListeners'
+  import getInnerListeners, { getCustomEvent } from './getInnerListeners'
 
   export default {
     name: 'mpx-image',
@@ -22,18 +22,14 @@
     },
     beforeCreate () {
       this.image = new Image()
-      this.image.onload = (e) => {
-        extendEvent(e, {
-          detail: {
-            width: this.image.width,
-            height: this.image.height
-          }
-        })
-
-        this.$emit('load', e)
+      this.image.onload = () => {
+        this.$emit('load', getCustomEvent('load', {
+          width: this.image.width,
+          height: this.image.height
+        }, this))
       }
-      this.image.onerror = (e) => {
-        this.$emit('error', e)
+      this.image.onerror = () => {
+        this.$emit('error', getCustomEvent('error', {}, this))
       }
     },
     watch: {
@@ -48,9 +44,9 @@
       if (this.mode === 'widthFix' || this.mode === 'heightFix') {
         let style
         if (this.mode === 'widthFix') {
-           style = {
-             height: 'auto'
-           }
+          style = {
+            height: 'auto'
+          }
         } else {
           style = {
             width: 'auto'

package/lib/runtime/components/web/mpx-movable-view.vue

@@ -179,7 +179,7 @@
               x: this.roundFun(position.x) ? this.roundFun(position.x) : 0,
               y: this.roundFun(position.y) ? this.roundFun(position.y) : 0,
               source: this.source
-            }))
+            }, this))
           }
           this.lastestX = this.roundFun(position.x)
           this.lastestY = this.roundFun(position.y)
@@ -215,7 +215,7 @@
               this.touchEvent = 'vtouchmove'
             }
           }
-          this.$emit(this.touchEvent)
+          this.$emit(this.touchEvent, getCustomEvent(this.touchEvent, {}, this))
           this.isFirstTouch = false
         })
         if (this.inertia) { // movable-view是否带有惯性
@@ -233,7 +233,7 @@
               x: this.roundFun(this.bs.x),
               y: this.roundFun(this.bs.y),
               scale: this.roundFun(scale)
-            }))
+            }, this))
             this.lastestScale = this.roundFun(scale)
           })
           this.bs.on('zoomEnd', ({ scale }) => {

package/lib/runtime/components/web/mpx-picker-view.vue

@@ -97,13 +97,13 @@
       },
       notifyChange() {
         const value = this.getValue()
-        this.$emit('change', getCustomEvent('change', {value}))
+        this.$emit('change', getCustomEvent('change', { value }, this))
       },
-      notifyPickstart(value) {
-        this.$emit('pickstart', getCustomEvent('pickstart', {value}))
+      notifyPickstart() {
+        this.$emit('pickstart', getCustomEvent('pickstart', {}, this))
       },
-      notifyPickend(value) {
-        this.$emit('pickend', getCustomEvent('pickend', {value}))
+      notifyPickend() {
+        this.$emit('pickend', getCustomEvent('pickend', {}, this))
       }
     }
   }

package/lib/runtime/components/web/mpx-picker.vue

@@ -266,11 +266,11 @@
           default:
             value = this.selectedIndex[0]
         }
-        this.$emit('change', getCustomEvent('change', {value}))
+        this.$emit('change', getCustomEvent('change', {value}, this))
       },
       _cancel () {
         this.hide()
-        this.$emit('cancel', getCustomEvent('cancel'))
+        this.$emit('cancel', getCustomEvent('cancel', {}, this))
       },
       _isMoving () {
         return this.wheels.some((wheel) => {
@@ -327,7 +327,7 @@
                       this.$emit('columnchange', getCustomEvent('columnchange', {
                         column: i,
                         value: currentIndex
-                      }))
+                      }, this))
                     }
                   }
                   if (this.mode === 'time' || this.mode === 'date') {

package/lib/runtime/components/web/mpx-progress.vue

@@ -113,7 +113,9 @@
         ref: 'progress',
         on: {
           transitionend: () => {
-            this.$emit('activeend', getCustomEvent('activeend'))
+            this.$emit('activeend', getCustomEvent('activeend', {
+              curPercent: this.percent
+            }, this))
           }
         }
       })

package/lib/runtime/components/web/mpx-radio-group.vue

@@ -84,7 +84,7 @@
         } else {
           value = this.getValue()
         }
-        this.$emit('change', getCustomEvent('change', { value }, this.$refs.radioGroup))
+        this.$emit('change', getCustomEvent('change', { value }, this))
       }
     }
   }

package/lib/runtime/components/web/mpx-scroll-view.vue

@@ -124,7 +124,7 @@
       refresherTriggered: {
         handler (val) {
           if (!val) {
-            this.$emit('refresherrestore')
+            this.$emit('refresherrestore', getCustomEvent('refresherrestore', {}, this))
             this.isLoading = false
             this.isAutoPullDown = true
             this.bs && this.bs.finishPullDown()
@@ -182,7 +182,7 @@
             scrollHeight: this.bs.scrollerHeight,
             deltaX,
             deltaY
-          }))
+          }, this))
           if (this.bs.minScrollX - x < this._upperThreshold && deltaX > 0) {
             this.dispatchScrollTo('left')
           }
@@ -212,7 +212,7 @@
               this.$emit('dragstart', getCustomEvent('dragstart', {
                 scrollLeft: this.bs.x ? this.bs.x * -1 : 0,
                 scrollTop: this.bs.y ? this.bs.y * -1 : 0
-              }))
+              }, this))
             }
             if (this.refresherEnabled) {
               this.isAutoPullDown = false
@@ -223,13 +223,13 @@
               this.$emit('dragging', getCustomEvent('dragging', {
                 scrollLeft: this.bs.x ? this.bs.x * -1 : 0,
                 scrollTop: this.bs.y ? this.bs.y * -1 : 0
-              }))
+              }, this))
             }
             if (this.refresherEnabled) {
               if (this.bs.y > 0 && this.bs.y < this.refresherThreshold && this.bs.movingDirectionY !== 1) {
                 this.isAutoPullDown = false
                 this.isLoading = false
-                this.$emit('refresherpulling')
+                this.$emit('refresherpulling', getCustomEvent('refresherpulling', {}, this))
               }
             }
           })
@@ -238,7 +238,7 @@
               this.$emit('dragend', getCustomEvent('dragend', {
                 scrollLeft: this.bs.x ? this.bs.x * -1 : 0,
                 scrollTop: this.bs.y ? this.bs.y * -1 : 0
-              }))
+              }, this))
             }
           })
           if (this.refresherEnabled) {
@@ -248,12 +248,12 @@
                 this.isLoading = true
                 if (this.bs.y < this.refresherThreshold) {
                   this.isAutoPullDown = true
-                  this.$emit('refresherabort')
+                  this.$emit('refresherabort', getCustomEvent('refresherabort', {}, this))
                 }
               }
             })
             this.bs.on('pullingDown', () => {
-              this.$emit('refresherrefresh')
+              this.$emit('refresherrefresh', getCustomEvent('refresherrefresh', {}, this))
             })
           }
         }
@@ -312,7 +312,7 @@
       dispatchScrollTo: throttle(function (direction) {
         let eventName = 'scrolltoupper'
         if (direction === 'bottom' || direction === 'right') eventName = 'scrolltolower'
-        this.$emit(eventName, getCustomEvent(eventName, { direction }))
+        this.$emit(eventName, getCustomEvent(eventName, { direction }, this))
       }, 200, {
         leading: true,
         trailing: false

package/lib/runtime/components/web/mpx-slider.vue

@@ -156,12 +156,12 @@
           let eventName = 'changing'
           let moveStartX = event.targetTouches[0] && event.targetTouches[0].pageX
           this.setLineValue(moveStartX)
-          this.$emit(eventName, getCustomEvent(eventName, { value: this.sliderValue }, this.$refs.slider))
+          this.$emit(eventName, getCustomEvent(eventName, { value: this.sliderValue }, this))
         }
       },
       sliderTouchEnd (event) {
         let eventName = 'change'
-        this.$emit(eventName, getCustomEvent(eventName, { value: this.sliderValue }, this.$refs.slider))
+        this.$emit(eventName, getCustomEvent(eventName, { value: this.sliderValue }, this))
         this.isDrag = false
       },
       sliderClick (event) {
@@ -170,7 +170,7 @@
         }
         this.setLineValue(event.pageX)
         let eventName = 'change'
-        this.$emit(eventName, getCustomEvent(eventName, { value: this.sliderValue }, this.$refs.slider))
+        this.$emit(eventName, getCustomEvent(eventName, { value: this.sliderValue }, this))
       },
       setLineValue (moveStartX) {
         moveStartX = moveStartX - this.startX
@@ -200,7 +200,7 @@
         } else {
           value = this.getValue()
         }
-        this.$emit('change', getCustomEvent('change', { value: value }, this.$refs.slider))
+        this.$emit('change', getCustomEvent('change', { value: value }, this))
       }
     }
   }

package/lib/runtime/components/web/mpx-swiper.vue

@@ -145,7 +145,7 @@
           current: this.currentIndex,
           currentItemId: this.itemIds[this.currentIndex] || '',
           source: this.changeSource
-        }))
+        }, this))
       })
 
       this.bs.on('scrollEnd', () => {
@@ -153,13 +153,13 @@
           current: this.currentIndex,
           currentItemId: this.itemIds[this.currentIndex] || '',
           source: this.changeSource
-        }))
+        }, this))
       })
       this.bs.on('scroll', throttle(({ x, y }) => {
         this.$emit('transition', getCustomEvent('transition', {
           dx: this.lastX - x,
           dy: this.lastY - y
-        }))
+        }, this))
       }, 30, {
         leading: true,
         trailing: false

package/lib/runtime/components/web/mpx-switch.vue

@@ -80,7 +80,7 @@
         } else {
           value = this.getValue()
         }
-        this.$emit('change', getCustomEvent('change', { value }, this.$refs.switch))
+        this.$emit('change', getCustomEvent('change', { value }, this))
       }
     }
   }

package/lib/runtime/components/web/mpx-text.vue

@@ -34,27 +34,32 @@
       }
     },
     render (createElement) {
-      let text = ''
       let classNames = ['mpx-text']
       let decode = false
       const slots = this.$slots.default || []
+      const newSlots = []
       slots.forEach((item) => {
         if (item.text) {
-          // item.text = encodeText(item.text)
-          text += item.text
+          switch (this.space) {
+            case 'ensp':
+            case 'emsp':
+            case 'nbsp':
+              decode = true
+              item.text = item.text.replace(/ /g, `&${this.space};`)
+              break
+          }
+          newSlots.push(createElement('span', {
+            domProps: {
+              innerHTML: item.text
+            }
+          }))
+        } else {
+          newSlots.push(item)
         }
       })
       if (this.selectable) {
         classNames.push('selectable')
       }
-      switch (this.space) {
-        case 'ensp':
-        case 'emsp':
-        case 'nbsp':
-          decode = true
-          text = text.replace(/ /g, `&${this.space};`)
-          break
-      }
       if (this.decode) {
         decode = true
       }
@@ -62,12 +67,7 @@
         class: classNames,
         on: getInnerListeners(this)
       }
-      if (decode) {
-        data.domProps = {
-          innerHTML: text
-        }
-      }
-      return createElement('span', data, slots)
+      return createElement('span', data, decode ? newSlots : slots)
     }
   }
 </script>

package/lib/runtime/components/web/mpx-video.vue

@@ -14,7 +14,7 @@
 </template>
 
 <script>
-  import { inheritEvent, extendEvent } from './getInnerListeners'
+  import { inheritEvent } from './getInnerListeners'
 
   export default {
     name: 'mpx-video',
@@ -169,75 +169,61 @@
         const videoNode = this.$refs['_mpx_video_ref']
 
         videoNode.addEventListener('play', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('play', e)
+          this.$emit('play', inheritEvent('play', e, {}))
         })
 
         videoNode.addEventListener('pause', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('pause', e)
+          this.$emit('pause', inheritEvent('pause', e, {}))
         })
 
         videoNode.addEventListener('ended', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('ended', e)
+          this.$emit('ended', inheritEvent('ended', e, {}))
         })
 
         videoNode.addEventListener('timeupdate', (e) => {
           const eNode = e.target
-          extendEvent(e, { detail: { currentTime: eNode.currentTime, duration: eNode.duration } })
-          this.$emit('timeupdate', e)
+          this.$emit('timeupdate', inheritEvent('timeupdate', e, { currentTime: eNode.currentTime, duration: eNode.duration }))
         })
 
         videoNode.addEventListener('error', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('error', e)
+          this.$emit('error', inheritEvent('error', e, {}))
         })
 
         videoNode.addEventListener('waiting', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('waiting', e)
+          this.$emit('waiting', inheritEvent('waiting', e, {}))
         })
 
         videoNode.addEventListener('loadedmetadata', (e) => {
           const eNode = e.target
-          extendEvent(e, { detail: { width: eNode.videoWidth, height: eNode.videoHeight, duration: eNode.duration } })
-          this.$emit('loadedmetadata', e)
+          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)
-          extendEvent(e, { detail: { buffered: buffered * 100 } })
-          this.$emit('progress', e)
+          this.$emit('progress', inheritEvent('progress', e, { buffered: buffered * 100 }))
         })
 
         videoNode.addEventListener('seeked', (e) => {
           const eNode = e.target
-          const ne = inheritEvent('seekcomplete', e, { position: eNode.currentTime })
-          this.$emit('seekcomplete', ne)
+          this.$emit('seekcomplete', inheritEvent('seekcomplete', e, { position: eNode.currentTime }))
         })
 
         videoNode.addEventListener('fullscreenchange', (e) => {
           //  TODO direction
-          extendEvent(e, { detail: { fullScreen: false } })
           if (document.isFullScreen) {
-            e.detail.fullScreen = true
-            this.$emit('fullscreenchange', e)
+            this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: true }))
           } else {
-            e.detail.fullScreen = false
-            this.$emit('fullscreenchange', e)
+            this.$emit('fullscreenchange', inheritEvent('fullscreenchange', e, { fullScreen: false }))
           }
         })
 
         videoNode.addEventListener('enterpictureinpicture', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('enterpictureinpicture', e)
+          this.$emit('enterpictureinpicture', inheritEvent('enterpictureinpicture', e, {}))
         })
 
         videoNode.addEventListener('leavepictureinpicture', (e) => {
-          extendEvent(e, { detail: {} })
-          this.$emit('leavepictureinpicture', e)
+          this.$emit('leavepictureinpicture', inheritEvent('leavepictureinpicture', e, {}))
         })
       }
     }

package/lib/runtime/components/web/mpx-web-view.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script>
-  import getInnerListeners, { getCustomEvent } from './getInnerListeners'
+  import { getCustomEvent } from './getInnerListeners'
   import { redirectTo, navigateTo, navigateBack, reLaunch, switchTab} from '@mpxjs/api-proxy/src/web/api/index'
 
   const eventLoad = 'load'
@@ -43,17 +43,15 @@
         return domain
       }
     },
-    created () {
+    mounted () {
       setTimeout(() => {
         if (!this.Loaded) {
           const loadData = {
             src: this.src
           }
-          this.$emit(eventError, getCustomEvent(eventError, loadData))
+          this.$emit(eventError, getCustomEvent(eventError, loadData, this))
         }
       }, 1000)
-    },
-    mounted () {
       this.mpxIframe = this.$refs.mpxIframe
       this.mpxIframe.addEventListener('load', (event) => {
         event.currentTarget.contentWindow.postMessage(this.mainDomain, '*')
@@ -94,7 +92,7 @@
             const loadData = {
               src: this.src
             }
-            this.$emit(eventLoad, getCustomEvent(eventLoad, loadData))
+            this.$emit(eventLoad, getCustomEvent(eventLoad, loadData, this))
         }
       })
     },
@@ -110,7 +108,7 @@
         type: 'message',
         data: this.messageList
       }
-      this.$emit(eventMessage, getCustomEvent(eventMessage, data))
+      this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
     },
     destroyed () {
       if (!this.isPostMessage) {
@@ -120,7 +118,7 @@
         type: 'message',
         data: this.messageList
       }
-      this.$emit(eventMessage, getCustomEvent(eventMessage, data))
+      this.$emit(eventMessage, getCustomEvent(eventMessage, data, this))
     }
   }
 </script>

package/lib/style-compiler/index.js

@@ -30,7 +30,7 @@ module.exports = function (css, map) {
 
   const inlineConfig = Object.assign({}, mpx.postcssInlineConfig, { defs })
   loadPostcssConfig(this, inlineConfig).then(config => {
-    const plugins = config.plugins.concat(trim)
+    const plugins = [trim] // init with trim plugin
     const options = Object.assign(
       {
         to: this.resourcePath,
@@ -79,6 +79,8 @@ module.exports = function (css, map) {
       }
     }
 
+    plugins.push(...config.plugins) // push user config plugins
+
     return postcss(plugins)
       .process(css, options)
       .then(result => {

package/lib/wxss/runtime/api.js

@@ -2,15 +2,15 @@
   MIT License http://www.opensource.org/licenses/mit-license.php
   Author Tobias Koppers @sokra
 */
-module.exports = (cssWithMappingToString) => {
+module.exports = function (cssWithMappingToString) {
   const list = []
 
   // return the list of modules as css string
   list.toString = function toString () {
-    return this.map((item) => {
-      let content = ''
+    return this.map(function (item) {
+      var content = ''
 
-      const needLayer = typeof item[5] !== 'undefined'
+      var needLayer = typeof item[5] !== 'undefined'
 
       if (item[4]) {
         content += `@supports (${item[4]}) {`
@@ -48,11 +48,11 @@ module.exports = (cssWithMappingToString) => {
       modules = [[null, modules, undefined]]
     }
 
-    const alreadyImportedModules = {}
+    var alreadyImportedModules = {}
 
     if (dedupe) {
       for (let k = 0; k < this.length; k++) {
-        const id = this[k][0]
+        var id = this[k][0]
 
         if (id != null) {
           alreadyImportedModules[id] = true
@@ -60,8 +60,8 @@ module.exports = (cssWithMappingToString) => {
       }
     }
 
-    for (let k = 0; k < modules.length; k++) {
-      const item = [].concat(modules[k])
+    for (var k = 0; k < modules.length; k++) {
+      var item = [].concat(modules[k])
 
       if (dedupe && alreadyImportedModules[item[0]]) {
         continue

package/lib/wxss/runtime/noSourceMaps.js

@@ -1 +1,3 @@
-module.exports = (i) => i[1]
+module.exports = function (i) {
+  return i[1]
+}

package/lib/wxss/runtime/sourceMaps.js

@@ -1,6 +1,6 @@
-module.exports = (item) => {
-  const content = item[1]
-  const cssMapping = item[3]
+module.exports = function (item) {
+  var content = item[1]
+  var cssMapping = item[3]
 
   if (!cssMapping) {
     return content
@@ -8,13 +8,13 @@ module.exports = (item) => {
 
   if (typeof btoa === 'function') {
     // eslint-disable-next-line no-undef
-    const base64 = btoa(
+    var base64 = btoa(
       unescape(encodeURIComponent(JSON.stringify(cssMapping)))
     )
-    const data = `sourceMappingURL=data:application/json;charset=utf-8;base64,${base64}`
-    const sourceMapping = `/*# ${data} */`
+    var data = `sourceMappingURL=data:application/json;charset=utf-8;base64,${base64}`
+    var sourceMapping = `/*# ${data} */`
 
-    const sourceURLs = cssMapping.sources.map(
+    var sourceURLs = cssMapping.sources.map(
       (source) => `/*# sourceURL=${cssMapping.sourceRoot || ''}${source} */`
     )
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.8.35",
+  "version": "2.8.37",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -82,5 +82,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "ee18a2c1b3f78b7f3033398b83675cac40deb6c6"
+  "gitHead": "87ec3c789ed2a427e73b839a9d3548fb6e42d922"
 }