@mpxjs/webpack-plugin 2.7.42 → 2.7.43

package/lib/index.js

@@ -164,12 +164,6 @@ class MpxWebpackPlugin {
     }, options.nativeConfig)
     options.webConfig = options.webConfig || {}
     options.partialCompile = options.mode !== 'web' && options.partialCompile
-    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
@@ -574,7 +568,6 @@ class MpxWebpackPlugin {
           useRelativePath: this.options.useRelativePath,
           removedChunks: [],
           forceProxyEventRules: this.options.forceProxyEventRules,
-          proxyComponentEventsRules: this.options.proxyComponentEventsRules,
           pathHash: (resourcePath) => {
             if (this.options.pathHashMode === 'relative' && this.options.projectRoot) {
               return hash(path.relative(this.options.projectRoot, resourcePath))

package/lib/loader.js

@@ -126,11 +126,12 @@ module.exports = function (content) {
       if (mode === 'web') {
         if (ctorType === 'app' && !queryObj.isApp) {
           const request = addQuery(this.resource, { isApp: true })
+          const el = mpx.webConfig.el || '#app'
           output += `
       import App from ${stringifyRequest(request)}
       import Vue from 'vue'
       new Vue({
-        el: '#app',
+        el: '${el}',
         render: function(h){
           return h(App)
         }

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

@@ -1,5 +1,5 @@
 import { isEmptyObject } from './util'
-const isTouchDevice = 'ontouchstart' in document.documentElement
+const isTouchDevice = document && ('ontouchstart' in document.documentElement)
 
 function processModel (listeners, context) {
   // 该函数只有wx:model的情况下才调用，而且默认e.detail.value有值

package/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')
@@ -10,7 +11,6 @@ const addQuery = require('../utils/add-query')
 const transDynamicClassExpr = require('./trans-dynamic-class-expr')
 const dash2hump = require('../utils/hump-dash').dash2hump
 const { inBrowser } = require('../utils/env')
-const { matchCondition } = require('../utils/match-condition')
 
 /**
  * Make a map and return a function for checking if a key
@@ -746,7 +746,7 @@ function parse (template, options) {
         stack.push(element)
       } else {
         element.unary = true
-        closeElement(element, meta)
+        closeElement(element, meta, options)
       }
     },
 
@@ -761,7 +761,7 @@ function parse (template, options) {
         // pop stack
         stack.pop()
         currentParent = stack[stack.length - 1]
-        closeElement(element, meta)
+        closeElement(element, meta, options)
       }
     },
 
@@ -1813,57 +1813,67 @@ function processBuiltInComponents (el, meta) {
   }
 }
 
-function processAliEventHack (el, options, root) {
-  // 只处理组件根节点
-  if (!(options.isComponent && el === root && isRealNode(el))) {
-    return
-  }
-  const { proxyComponentEventsRules } = options
-  let fallThroughEvents = ['onTap']
-  // 判断当前文件是否在范围中
-  const filePath = options.filePath
-  for (let item of proxyComponentEventsRules) {
-    const {
-      include,
-      exclude
-    } = item || {}
-
-    if (matchCondition(filePath, {
-      include,
-      exclude
-    })) {
-      const eventsRaw = item.events
-      const events = Array.isArray(eventsRaw) ? eventsRaw : [eventsRaw]
-      fallThroughEvents = Array.from(new Set(fallThroughEvents.concat(events)))
-      break
-    }
+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}` }
+  ]
+  let newElAttrs = []
+  let allAttrs = cloneAttrsList(el.attrsList)
+
+  function processClone (attr) {
+    newElAttrs.push(attr)
   }
 
-  fallThroughEvents.forEach((type) => {
-    addAttrs(el, [{
-      name: type,
-      value: '__proxyEvent'
-    }])
-  })
-}
+  function processMove (attr) {
+    getAndRemoveAttr(el, attr.name)
+    newElAttrs.push(attr)
+  }
 
-function processAliStyleClassHack (el, options, root) {
-  // 处理组件根节点
-  if (options.isComponent && el === root && isRealNode(el)) {
-    ['style', 'class'].forEach((type) => {
-      let exp = getAndRemoveAttr(el, type).val
-      let typeName = type === 'class' ? 'className' : type
-      let sep = type === 'style' ? ';' : ' '
-      let newValue = exp ? `{{${typeName}||''}}${sep}${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: type,
-          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)
+  let 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。其他跳过。
@@ -1875,36 +1885,36 @@ function getVirtualHostRoot (options, meta) {
       !meta.options && (meta.options = {})
       meta.options.virtualHost = true
     }
-    if (mode === 'ali' && !options.hasVirtualHost) {
-      // ali组件根节点实体化
-      let rootView = createASTElement('view', [
-        {
-          name: 'class',
-          value: `${MPX_ROOT_VIEW} host-${options.moduleId}`
-        }
-      ])
-      processElement(rootView, rootView, options, meta)
-      return rootView
-    }
+    // if (mode === 'ali' && !options.hasVirtualHost) {
+    //   // ali组件根节点实体化
+    //   let rootView = createASTElement('view', [
+    //     {
+    //       name: 'class',
+    //       value: `${MPX_ROOT_VIEW} host-${options.moduleId}`
+    //     }
+    //   ])
+    //   processElement(rootView, rootView, options, meta)
+    //   return rootView
+    // }
   }
   return getTempNode()
 }
 
 function processShow (el, options, root) {
+  // 开启 virtualhost 全部走 props 传递处理
+  // 未开启 virtualhost 直接绑定 display:none 到节点上
   let show = getAndRemoveAttr(el, config[mode].directive.show).val
   if (mode === 'swan') show = wrapMustache(show)
-  let processFlag = el.parent === root
-  // 当ali且未开启virtualHost时，mpxShow打到根节点上
-  if (mode === 'ali' && !options.hasVirtualHost) processFlag = el === root
-  if (options.isComponent && processFlag && isRealNode(el)) {
-    if (show !== undefined) {
-      show = `{{${parseMustache(show).result}&&mpxShow}}`
-    } else {
-      show = '{{mpxShow}}'
+
+  if (options.hasVirtualHost) {
+    if (options.isComponent && el.parent === root && isRealNode(el)) {
+      if (show !== undefined) {
+        show = `{{${parseMustache(show).result}&&mpxShow}}`
+      } else {
+        show = '{{mpxShow}}'
+      }
     }
-  }
-  if (show !== undefined) {
-    if (isComponentNode(el, options)) {
+    if (isComponentNode(el, options) && show !== undefined) {
       if (show === '') {
         show = '{{false}}'
       }
@@ -1913,6 +1923,14 @@ function processShow (el, options, root) {
         value: show
       }])
     } else {
+      processShowStyle()
+    }
+  } else {
+    processShowStyle()
+  }
+
+  function processShowStyle () {
+    if (show !== undefined) {
       const showExp = parseMustache(show).result
       let oldStyle = getAndRemoveAttr(el, 'style').val
       oldStyle = oldStyle ? oldStyle + ';' : ''
@@ -2094,11 +2112,6 @@ function processElement (el, root, options, meta) {
     processShow(el, options, root)
   }
 
-  if (transAli || (srcMode === 'ali' && mode === 'ali')) {
-    processAliStyleClassHack(el, options, root)
-    processAliEventHack(el, options, root)
-  }
-
   if (!pass) {
     processBindEvent(el, options)
     processComponentIs(el, options)
@@ -2107,7 +2120,7 @@ function processElement (el, root, options, meta) {
   processAttrs(el, options)
 }
 
-function closeElement (el, meta) {
+function closeElement (el, meta, options) {
   postProcessAtMode(el)
   if (mode === 'web') {
     postProcessWxs(el, meta)
@@ -2117,8 +2130,13 @@ function closeElement (el, meta) {
   }
   const pass = isNative || postProcessTemplate(el) || processingTemplate
   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)

package/lib/template-compiler/index.js

@@ -59,8 +59,7 @@ module.exports = function (raw) {
     checkUsingComponents: mpx.checkUsingComponents,
     globalComponents: Object.keys(mpx.usingComponents),
     forceProxyEvent: matchCondition(resourcePath, mpx.forceProxyEventRules),
-    hasVirtualHost: matchCondition(resourcePath, mpx.autoVirtualHostRules),
-    proxyComponentEventsRules: mpx.proxyComponentEventsRules
+    hasVirtualHost: matchCondition(resourcePath, mpx.autoVirtualHostRules)
   })
 
   if (meta.wxsContentMap) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.7.42",
+  "version": "2.7.43",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -80,5 +80,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "c93b582d76ccf1a0cd9ee073d12e436600e2f37d"
+  "gitHead": "9ba777d5b52c8a2f802c47c2dc10c6984deff1d8"
 }