@mpxjs/webpack-plugin 2.9.0-beta.1 → 2.9.0-beta.3

package/lib/platform/json/wx/index.js

@@ -3,6 +3,7 @@ const normalizeTest = require('../normalize-test')
 const changeKey = require('../change-key')
 const normalize = require('../../../utils/normalize')
 const { capitalToHyphen } = require('../../../utils/string')
+const { isOriginTag } = require('../../../utils/dom-tag-config')
 
 const mpxViewPath = normalize.lib('runtime/components/ali/mpx-view.mpx')
 const mpxTextPath = normalize.lib('runtime/components/ali/mpx-text.mpx')
@@ -70,6 +71,19 @@ module.exports = function getSpec ({ warn, error }) {
     return input
   }
 
+  // 校验输出支付宝 componentGenerics 配置的正确性
+  function aliComponentGenericsValidate (input) {
+    const componentGenerics = input.componentGenerics
+    if (componentGenerics && typeof componentGenerics === 'object') {
+      Object.keys(componentGenerics).forEach(key => {
+        if (!componentGenerics[key].default) {
+          error(`Ali environment componentGenerics need to specify a default custom component! please check the configuration of component ${key}`)
+        }
+      })
+    }
+    return input
+  }
+
   function fillGlobalComponents (input, { globalComponents }) {
     if (globalComponents) {
       Object.assign(globalComponents, input.usingComponents)
@@ -112,10 +126,30 @@ module.exports = function getSpec ({ warn, error }) {
     }
   }
 
+  /**
+   * 将小程序代码中使用的与原生 HTML tag 同名组件进行转化，以解决与原生tag命名冲突问题。
+   * @param {string} type usingComponents
+   * @returns input
+   */
+  function webHTMLTagProcesser (type) {
+    return function (input) {
+      const usingComponents = input[type]
+      if (usingComponents) {
+        Object.keys(usingComponents).forEach(tag => {
+          if (isOriginTag(tag)) {
+            usingComponents[`mpx-com-${tag}`] = usingComponents[tag]
+            delete usingComponents[tag]
+          }
+        })
+      }
+      return input
+    }
+  }
+
   const componentRules = [
     {
       test: 'componentGenerics',
-      ali: deletePath(true)
+      ali: aliComponentGenericsValidate
     },
     {
       test: 'componentPlaceholder',
@@ -124,6 +158,10 @@ module.exports = function getSpec ({ warn, error }) {
       tt: deletePath(),
       jd: deletePath()
     },
+    {
+      test: 'usingComponents',
+      web: webHTMLTagProcesser('usingComponents')
+    },
     {
       test: 'usingComponents',
       ali: componentNameCapitalToHyphen('usingComponents'),
@@ -224,7 +262,7 @@ module.exports = function getSpec ({ warn, error }) {
   }
 
   const spec = {
-    supportedModes: ['ali', 'swan', 'qq', 'tt', 'jd', 'qa', 'dd'],
+    supportedModes: ['ali', 'swan', 'qq', 'tt', 'jd', 'qa', 'dd', 'web'],
     normalizeTest,
     page: [
       ...windowRules,
@@ -325,6 +363,10 @@ module.exports = function getSpec ({ warn, error }) {
         tt: deletePath(),
         jd: deletePath(true)
       },
+      {
+        test: 'usingComponents',
+        web: webHTMLTagProcesser('usingComponents')
+      },
       {
         test: 'usingComponents',
         ali: componentNameCapitalToHyphen('usingComponents'),

package/lib/platform/run-rules.js

@@ -32,7 +32,8 @@ module.exports = function runRules (rules = [], input, options = {}) {
       if (result !== undefined) {
         input = result
       }
-      if (!waterfall) break
+      // rule 内外 waterfall 均为 false 时跳过
+      if (!rule.waterfall && !waterfall) break
     }
   }
   return input

package/lib/platform/template/normalize-component-rules.js

@@ -11,6 +11,8 @@ module.exports = function normalizeComponentRules (cfgs, spec) {
     if (cfg.test) {
       result.test = cfg.test
     }
+    // 透传 waterfall 信息
+    if (cfg.waterfall) result.waterfall = cfg.waterfall
     const supportedModes = cfg.supportedModes || spec.supportedModes
     // 合并component-config中组件的event 与index中公共的event规则
     const eventRules = (cfg.event || []).concat(spec.event.rules)

package/lib/platform/template/wx/component-config/fix-html-tag.js

@@ -0,0 +1,17 @@
+const { isOriginTag } = require('../../../../utils/dom-tag-config')
+
+module.exports = function () {
+  return {
+    waterfall: true,
+    test: (input) => isOriginTag(input),
+    // 处理原生tag
+    web (tag, data = {}) {
+      // @see packages/webpack-plugin/lib/platform/json/wx/index.js webHTMLTagProcesser
+      const newTag = `mpx-com-${tag}`
+      const usingComponents = data.usingComponents || []
+      // 存在同名组件，则返回新tag
+      if (usingComponents.includes(newTag)) return newTag
+      return tag
+    }
+  }
+}

package/lib/platform/template/wx/component-config/index.js

@@ -39,6 +39,7 @@ const view = require('./view')
 const webView = require('./web-view')
 const wxs = require('./wxs')
 const component = require('./component')
+const fixHTMLTag = require('./fix-html-tag')
 
 module.exports = function getComponentConfigs ({ warn, error }) {
   /**
@@ -79,6 +80,7 @@ module.exports = function getComponentConfigs ({ warn, error }) {
 
   // 转换规则只需以微信为基准配置微信和支付宝的差异部分，比如微信和支付宝都支持但是写法不一致，或者微信支持而支付宝不支持的部分(抛出错误或警告)
   return [
+    fixHTMLTag(),
     ...Nonsupport({ print }),
     ad({ print }),
     view({ print }),

package/lib/platform/template/wx/index.js

@@ -190,15 +190,7 @@ module.exports = function getSpec ({ warn, error }) {
           el.isStyleParsed = true
           el.attrsList.filter(item => this.test.test(item.name)).forEach((item) => {
             const parsed = parseMustacheWithContext(item.value)
-            if (item.name === 'style') {
-              if (parsed.hasBinding || parsed.result.indexOf('rpx') > -1) {
-                styleBinding.push(parsed.result)
-              } else {
-                styleBinding.push(JSON.stringify(item.value))
-              }
-            } else if (item.name === 'wx:style') {
-              styleBinding.push(parsed.result)
-            }
+            styleBinding.push(parsed.result)
           })
           return {
             name: ':style',
@@ -293,18 +285,39 @@ module.exports = function getSpec ({ warn, error }) {
         },
         swan ({ name, value }, { eventRules }) {
           const match = this.test.exec(name)
+          const prefix = match[1]
           const eventName = match[2]
-          runRules(eventRules, eventName, { mode: 'swan' })
+          const modifierStr = match[3] || ''
+          const rPrefix = runRules(spec.event.prefix, prefix, { mode: 'swan' })
+          const rEventName = runRules(eventRules, eventName, { mode: 'swan' })
+          return {
+            name: rPrefix + rEventName + modifierStr,
+            value
+          }
         },
         qq ({ name, value }, { eventRules }) {
           const match = this.test.exec(name)
+          const prefix = match[1]
           const eventName = match[2]
-          runRules(eventRules, eventName, { mode: 'qq' })
+          const modifierStr = match[3] || ''
+          const rPrefix = runRules(spec.event.prefix, prefix, { mode: 'qq' })
+          const rEventName = runRules(eventRules, eventName, { mode: 'qq' })
+          return {
+            name: rPrefix + rEventName + modifierStr,
+            value
+          }
         },
         jd ({ name, value }, { eventRules }) {
           const match = this.test.exec(name)
+          const prefix = match[1]
           const eventName = match[2]
-          runRules(eventRules, eventName, { mode: 'jd' })
+          const modifierStr = match[3] || ''
+          const rPrefix = runRules(spec.event.prefix, prefix, { mode: 'jd' })
+          const rEventName = runRules(eventRules, eventName, { mode: 'jd' })
+          return {
+            name: rPrefix + rEventName + modifierStr,
+            value
+          }
         },
         // tt ({ name, value }, { eventRules }) {
         //   const match = this.test.exec(name)
@@ -320,15 +333,33 @@ module.exports = function getSpec ({ warn, error }) {
         // },
         tt ({ name, value }, { eventRules }) {
           const match = this.test.exec(name)
+          const prefix = match[1]
           const eventName = match[2]
-          runRules(eventRules, eventName, { mode: 'tt' })
+          const modifierStr = match[3] || ''
+          const rPrefix = runRules(spec.event.prefix, prefix, { mode: 'tt' })
+          const rEventName = runRules(eventRules, eventName, { mode: 'tt' })
+          return {
+            name: rPrefix + rEventName + modifierStr,
+            value
+          }
         },
         dd ({ name, value }, { eventRules }) {
           const match = this.test.exec(name)
+          const prefix = match[1]
           const eventName = match[2]
-          runRules(eventRules, eventName, { mode: 'dd' })
+          const modifierStr = match[3] || ''
+          const rPrefix = runRules(spec.event.prefix, prefix, { mode: 'dd' })
+          const rEventName = runRules(eventRules, eventName, { mode: 'dd' })
+          return {
+            name: rPrefix + rEventName + modifierStr,
+            value
+          }
         },
         web ({ name, value }, { eventRules, el }) {
+          if (parseMustacheWithContext(value).hasBinding) {
+            error('Web environment does not support mustache binding in event props!')
+            return
+          }
           const match = this.test.exec(name)
           const prefix = match[1]
           const eventName = match[2]

package/lib/runtime/base.styl

@@ -48,11 +48,19 @@ span {
   white-space: pre-line;
 }
 
-html, body, .app {
+html, body, #app {
+  display: block;
   width: 100%;
   height: 100%;
 }
 
+page {
+  display: block;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+}
+
 .pull-down-loading {
   position: absolute;
   width: 100%;
@@ -120,8 +128,3 @@ html, body, .app {
   font-family "weui"
   src url('data:application/octet-stream;base64,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') format('truetype')
 }
-
-.mpx-root-view {
-  display: inline
-  line-height: normal
-}

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

@@ -1,3 +1,12 @@
+const {
+  isRichTextTag,
+  isUnaryTag,
+  isSpace,
+  isContWidth,
+  isContHeight,
+  isContConRow
+} = require('../../../utils/dom-tag-config')
+
 // eslint-disable-next-line
 const attribute = /^\s*([^\s"'<>\/=]+)(?:\s*(=)\s*(?:"([^"]*)"+|'([^']*)'+|([^\s"'=<>`]+)))?/ // useless escape
 const ncname = '[a-zA-Z_][\\w\\-\\.]*'
@@ -11,36 +20,6 @@ const comment = /^<!\--/
 const invalidAttributeRE = /[\s"'<>\/=]/
 let currentParent
 
-function makeMap (str, expectsLowerCase) {
-  const map = Object.create(null)
-  const list = str.split(',')
-  for (let i = 0; i < list.length; i++) {
-    map[list[i]] = true
-  }
-  return expectsLowerCase
-    ? val => map[val.toLowerCase()]
-    : val => map[val]
-}
-
-const isRichTextTag = makeMap(
-  'a,abbr,address,article,aside,b,bdi,bdo,big,blockquote,br,caption,' +
-  'center,cite,code,col,colgroup,dd,del,div,dl,dt,em,fieldset,' +
-  'font,footer,h1,h2,h3,h4,h5,h6,header,hr,i,img,ins,label,legend,' +
-  'li,mark,nav,ol,p,pre,q,rt,ruby,s,section,small,span,strong,sub,sup,' +
-  'table,tbody,td,tfoot,th,thead,tr,tt,u,ul'
-)
-const isUnaryTag = makeMap(
-  'area,base,br,col,embed,frame,hr,img,input,isindex,keygen,' +
-  'link,meta,param,source,track,wbr'
-)
-const isSpace = makeMap('ensp,emsp,nbsp')
-
-const isContWidth = makeMap('col,colgroup,img,table,td,th,tr')
-
-const isContHeight = makeMap('img,td,th,tr')
-
-const isContConRow = makeMap('td,th,tr')
-
 function makeAttrsMap (attrs) {
   const map = {}
   for (let i = 0, l = attrs.length; i < l; i++) {

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

@@ -143,20 +143,8 @@ 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
-    })
-  }
+  const targetEl = (target && target.$el) || null
+  const targetInfo = targetEl ? { target: targetEl, currentTarget: targetEl } : {}
   return {
     type,
     detail,

package/lib/runtime/components/web/mpx-keep-alive.vue

@@ -30,9 +30,7 @@
   }
 
   function getVnodeKey (vnode) {
-    if (vnode && vnode.componentOptions) {
-      return vnode.componentOptions.Ctor.cid + (vnode.componentOptions.tag ? ('::' + (vnode.componentOptions.tag)) : '')
-    }
+    return vnode.tag + (vnode.key ? `::${vnode.key}` : '')
   }
 
   export default {
@@ -44,12 +42,13 @@
       if (!isBrowser) {
         return vnode || (slot && slot[0])
       }
-      const vnodeKey = getVnodeKey(vnode)
       const router = global.__mpxRouter
-      if (vnodeKey && router && vnode.data.routerView) {
+      if (router) {
+        // 存在routeCount的情况下修改vnode.key避免patch时复用旧节点实例
+        if (router.currentRoute.query.routeCount) vnode.key = router.currentRoute.query.routeCount
+        const vnodeKey = getVnodeKey(vnode)
         if (router.needCache) {
           router.needCache.vnode = vnode
-          router.needCache.vnodeKey = vnodeKey
           router.needCache = null
         }
 
@@ -69,25 +68,17 @@
 
         const stack = router.stack
         if (stack.length) {
-          // 只要历史栈缓存中存在对应的页面存活实例，就进行复用
+          // 只要历史栈缓存中存在对应的页面存活实例且vnodeKey相同，就进行复用
           for (let i = stack.length; i > 0; i--) {
             const current = stack[i - 1]
-            if (current.vnode && current.vnodeKey === vnodeKey && current.vnode.componentInstance) {
+            if (current.vnode && getVnodeKey(current.vnode) === vnodeKey && current.vnode.componentInstance) {
               vnode.componentInstance = current.vnode.componentInstance
-              // 避免组件实例复用但是vnode.key不一致带来的bad case
-              vnode.key = current.vnode.key
               break
             }
           }
         }
 
-        if (router.__mpxAction) {
-          if (router.__mpxAction.type === 'reLaunch') {
-            // reLaunch时修改新vnode的key, 确保任何情况下都新创建组件实例
-            vnode.key = (vnode.key || '') + router.__mpxAction.reLaunchCount
-          }
-          router.__mpxAction = null
-        }
+        if (router.__mpxAction) router.__mpxAction = null
         vnode.data.keepAlive = true
       }
 

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

@@ -1,13 +1,13 @@
 <template>
-    <div class="mpx-movable-scroll-content" ref="scrollContent">
-        <div class="mpx-movable-scroll-item">
-            <slot></slot>
-        </div>
+  <div class="mpx-movable-scroll-content" ref="scrollContent">
+    <div class="mpx-movable-scroll-item">
+      <slot></slot>
     </div>
+  </div>
 </template>
 
 <script type="text/ecmascript-6">
-  import {getCustomEvent} from './getInnerListeners'
+  import {getCustomEvent, extendEvent} from './getInnerListeners'
   import BScroll from '@better-scroll/core'
   import Movable from '@better-scroll/movable'
   import Zoom from '@better-scroll/zoom'
@@ -121,6 +121,13 @@
           newVal = 0.5
         }
         this.bs.zoomTo(newVal, 'center', 'center')
+      },
+      disabled (newVal) {
+        if (newVal) {
+          this.bs && this.bs.disable()
+        } else {
+          this.bs && this.bs.enable()
+        }
       }
     },
     mounted () {
@@ -204,6 +211,14 @@
             this.bs.movingDirectionY = -1
           }
         })
+        actionsHandlerHooks.on('start', (e) => {
+          extendEvent(e, { detail: Object.assign({}, e.detail) })
+          this.$emit('touchstart', e)
+        })
+        actionsHandlerHooks.on('end', (e) => {
+          extendEvent(e, { detail: Object.assign({}, e.detail) })
+          this.$emit('touchend', e)
+        })
         actionsHandlerHooks.on('move', ({ deltaX, deltaY, e }) => {
           if (this.isZooming) {
             return
@@ -215,7 +230,9 @@
               this.touchEvent = 'vtouchmove'
             }
           }
-          this.$emit(this.touchEvent, getCustomEvent(this.touchEvent, {}, this))
+          extendEvent(e, { detail: Object.assign({}, e.detail), currentTarget: e.target })
+          this.$emit(this.touchEvent, e)
+          this.$emit('touchmove', e)
           this.isFirstTouch = false
         })
         if (this.inertia) { // movable-view是否带有惯性
@@ -302,7 +319,9 @@
   }
 </script>
 <style lang="stylus" rel="stylesheet/stylus" scoped>
-    .mpx-movable-scroll-content {
-        position: absolute
-    }
+  .mpx-movable-scroll-content
+    position: absolute
+    .mpx-movable-scroll-item
+      width: 100%
+      height: 100%
 </style>

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

@@ -163,7 +163,7 @@
     height: 100%
     overflow: hidden
     text-align: center
-    font-size: 14px
+    font-size: 16px
     position: relative
 
     &.mpx-picker-fade-enter, &.mpx-picker-fade-leave-active

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

@@ -113,7 +113,7 @@
     },
     watch: {
       scrollIntoView (val) {
-        this.bs && this.bs.scrollToElement('#' + val, this.scrollWithAnimation ? 200 : 0)
+        this.scrollToView(val, this.scrollWithAnimation ? 200 : 0)
       },
       _scrollTop (val) {
         this.bs && this.bs.scrollTo(this.bs.x, -val, this.scrollWithAnimation ? 200 : 0)
@@ -201,9 +201,7 @@
           leading: true,
           trailing: false
         }))
-        if (this.scrollIntoView) {
-          this.bs.scrollToElement('#' + this.scrollIntoView)
-        }
+        if (this.scrollIntoView) this.scrollToView(this.scrollIntoView)
         // 若开启自定义下拉刷新 或 开启 scroll-view 增强特性
         if (this.refresherEnabled || this.enhanced) {
           const actionsHandlerHooks = this.bs.scroller.actionsHandler.hooks
@@ -258,12 +256,17 @@
           }
         }
       },
+      scrollToView (id, duration = 0) {
+        if (!id) return
+        id = '#' + id
+        if (!document.querySelector(id)) return // 不存在元素时阻断，直接调用better-scroll的方法会报错
+        this.bs?.scrollToElement(id, duration)
+      },
       initLayerComputed () {
         const wrapper = this.$refs.wrapper
-        const wrapperWidth = wrapper.offsetWidth
-        const wrapperHeight = wrapper.offsetHeight
-        this.$refs.innerWrapper.style.width = `${wrapperWidth}px`
-        this.$refs.innerWrapper.style.height = `${wrapperHeight}px`
+        const computedStyle = getComputedStyle(wrapper)
+        this.$refs.innerWrapper.style.width = `${computedStyle.clientWidth -  parseInt(computedStyle.paddingLeft) - parseInt(computedStyle.paddingRight)}px`
+        this.$refs.innerWrapper.style.height = `${computedStyle.clientHeight - parseInt(computedStyle.paddingTop) - parseInt(computedStyle.paddingBottom)}px`
         const innerWrapper = this.$refs.innerWrapper
         const childrenArr = Array.from(innerWrapper.children)
 
@@ -342,7 +345,11 @@
             class: 'circle circle-c'
           }),
         ]
-      ) : null
+      ) : this.$slots.refresher
+        ? createElement('div', {
+          class: 'mpx-pull-down-slot',
+        }, this.$slots.refresher)
+        : null
 
       const pullDownWrapper = this.refresherEnabled ? createElement('div', {
         class: 'mpx-pull-down-wrapper',
@@ -376,7 +383,11 @@
         bottom: 20px
         left: 50%
         transform: translateX(-50%)
-
+      .mpx-pull-down-slot
+        position: absolute
+        width: 100%
+        height: auto
+        bottom: 0
       .mpx-pull-down-content-black
         .circle
           display: inline-block;