@mpxjs/webpack-plugin 2.6.114-alpha.8 → 2.6.115

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

@@ -1,5 +1,5 @@
 <script>
-  import getInnerListeners, { extendEvent } from './getInnerListeners'
+  import getInnerListeners from './getInnerListeners'
 
   export default {
     name: 'mpx-image',
@@ -23,13 +23,6 @@
     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.onerror = (e) => {
@@ -45,22 +38,14 @@
       }
     },
     render (createElement) {
-      if (this.mode === 'widthFix' || this.mode === 'heightFix') {
-        let style
-        if (this.mode === 'widthFix') {
-           style = {
-             height: 'auto'
-           }
-        } else {
-          style = {
-            width: 'auto'
-          }
-        }
+      if (this.mode === 'widthFix') {
         const domProps = {}
         if (this.src) domProps.src = this.src
         return createElement('img', {
           domProps,
-          style,
+          style: {
+            height: 'auto'
+          },
           class: ['mpx-image'],
           on: getInnerListeners(this, { ignoredListeners: ['load', 'error'] })
         })

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

@@ -85,10 +85,6 @@
       animation: {
         type: Boolean,
         default: true
-      },
-      speed: {
-        type: Number,
-        default: 1000
       }
     },
     watch: {
@@ -100,7 +96,7 @@
         if (newVal < this.bs.maxScrollX) {
           newVal = this.bs.maxScrollX
         }
-        this.bs.scrollTo(newVal, this.bs.y, this.speed)
+        this.bs.scrollTo(newVal, this.bs.y)
       },
       y (newVal) {
         this.source = ''
@@ -110,7 +106,7 @@
         if (newVal < this.bs.maxScrollY) {
           newVal = this.bs.maxScrollY
         }
-        this.bs.scrollTo(this.bs.x, newVal, this.speed)
+        this.bs.scrollTo(this.bs.x, newVal)
       },
       scaleValue (newVal) {
         this.isZooming = true

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

@@ -41,9 +41,7 @@
     },
     data () {
       return {
-        currentIndex: this.current,
-        currentChildLength: 0,
-        lastChildLength: 0
+        currentIndex: this.current
       }
     },
     computed: {
@@ -83,9 +81,6 @@
         }
       }
     },
-    updated () {
-      this.currentChildLength = this.$children && this.$children.length
-    },
     watch: {
       current (val) {
         if (this.bs) {
@@ -94,15 +89,6 @@
         }
         this.changeSource = ''
         this.goto(val)
-      },
-      currentChildLength(val) {
-        if (val < this.lastChildLength && val < this.currentIndex) {
-          this.goto(0, 0)
-        }
-        if (this.lastChildLength || (!this.lastChildLength && !this.autoplay)) {
-          this.bs && this.bs.refresh()
-        }
-        this.lastChildLength = val
       }
     },
     activated () {
@@ -181,11 +167,10 @@
       refresh () {
         this.bs && this.bs.refresh()
       },
-      goto (index, time) {
+      goto (index) {
         const x = this.vertical ? 0 : index
         const y = this.vertical ? index : 0
-        const speed = time === 0 ? 0 : this.duration
-        this.bs && this.bs.goToPage(x, y, speed)
+        this.bs && this.bs.goToPage(x, y)
       }
     },
     render (createElement) {

package/lib/runtime/i18n.wxs

@@ -6,6 +6,7 @@ function genRegExp (str, flags) {
   }
 }
 
+
 function likeArray (arr) {
   if (!__mpx_wxs__) {
     return Array.isArray(arr)
@@ -22,6 +23,7 @@ function isDef (v) {
   return v !== undefined && v !== null
 }
 
+
 var RE_TOKEN_LIST_VALUE = genRegExp('^[0-9]+')
 var RE_TOKEN_NAMED_VALUE = genRegExp('^[A-Za-z0-9_]+')
 
@@ -38,10 +40,7 @@ function parseMessage (format) {
     var char = format[position++]
     if (char === '{') {
       if (text) {
-        tokens.push({
-          type: 'text',
-          value: text
-        })
+        tokens.push({ type: 'text', value: text })
       }
 
       text = ''
@@ -57,10 +56,7 @@ function parseMessage (format) {
         : isClosed && RE_TOKEN_NAMED_VALUE.test(sub)
           ? 'named'
           : 'unknown'
-      tokens.push({
-        value: sub,
-        type: type
-      })
+      tokens.push({ value: sub, type: type })
     } else if (char === '%') {
       // when found rails i18n syntax, skip text capture
       if (format[(position)] !== '{') {
@@ -71,10 +67,7 @@ function parseMessage (format) {
     }
   }
 
-  text && tokens.push({
-    type: 'text',
-    value: text
-  })
+  text && tokens.push({ type: 'text', value: text })
 
   return tokens
 }
@@ -270,24 +263,19 @@ function exist (messages, locale, key) {
 var messages = {}
 var dateTimeFormats = {}
 var numberFormats = {}
-var locale = 'zh-CN'
-
-function getLocale () {
-  return __mpx_locale__ || locale
-}
 
 function getMessages () {
-  // __mpx_messages__会在编译时通过lib/wxs/i18n-loader注入
+  // __mpx_messages__会在编译时通过lib/wxs/wxs-i18n-loader注入
   return __mpx_messages__ || messages
 }
 
 function getDateTimeFormats () {
-  // __mpx_datetime_formats__会在编译时通过lib/wxs/i18n-loader注入
+  // __mpx_datetime_formats__会在编译时通过lib/wxs/wxs-i18n-loader注入
   return __mpx_datetime_formats__ || dateTimeFormats
 }
 
 function getNumberFormats () {
-  // __mpx_number_formats__会在编译时通过lib/wxs/i18n-loader注入
+  // __mpx_number_formats__会在编译时通过lib/wxs/wxs-i18n-loader注入
   return __mpx_number_formats__ || numberFormats
 }
 
@@ -351,15 +339,7 @@ module.exports = {
 }
 
 if (!__mpx_wxs__) {
-  if (!global.i18n) {
-    global.i18n = {
-      locale: getLocale(),
-      version: 0
-    }
-    global.i18nMethods = Object.assign(module.exports, {
-      __getMessages: getMessages,
-      __getDateTimeFormats: getDateTimeFormats,
-      __getNumberFormats: getNumberFormats
-    })
-  }
+  module.exports.__getMessages = getMessages
+  module.exports.__getDateTimeFormats = getDateTimeFormats
+  module.exports.__getNumberFormats = getNumberFormats
 }

package/lib/runtime/optionProcessor.js

@@ -4,7 +4,7 @@ export default function processOption (
   option,
   ctorType,
   firstPage,
-  outputPath,
+  componentId,
   pageConfig,
   pagesMap,
   componentsMap,
@@ -85,51 +85,6 @@ export default function processOption (
       }
     })
 
-    Vue.filter('transRpxStyle', style => {
-      const defaultTransRpxFn = function (match, $1) {
-        const rpx2vwRatio = +(100 / 750).toFixed(8)
-        return '' + ($1 * rpx2vwRatio) + 'vw'
-      }
-      const transRpxFn = global.__mpxTransRpxFn || defaultTransRpxFn
-      const parsedStyleObj = {}
-      const rpxRegExpG = /\b(\d+(\.\d+)?)rpx\b/g
-      const parseStyleText = (cssText) => {
-        const listDelimiter = /;(?![^(]*\))/g
-        const propertyDelimiter = /:(.+)/
-        if (typeof cssText === 'string') {
-          cssText.split(listDelimiter).forEach((item) => {
-            if (item) {
-              var tmp = item.split(propertyDelimiter)
-              tmp.length > 1 && (parsedStyleObj[tmp[0].trim()] = tmp[1].trim())
-            }
-          })
-        } else if (typeof cssText === 'object') {
-          if (Array.isArray(cssText)) {
-            cssText.forEach(cssItem => {
-              parseStyleText(cssItem)
-            })
-          } else {
-            Object.assign(parsedStyleObj, cssText)
-          }
-        }
-      }
-      const transRpxStyleFn = (val) => {
-        if (typeof val === 'string' && val.indexOf('rpx') > 0) {
-          return val.replace(rpxRegExpG, transRpxFn).replace(/"/g, '')
-        }
-        return val
-      }
-      if (style) {
-        style.forEach(item => {
-          parseStyleText(item)
-          for (let key in parsedStyleObj) {
-            parsedStyleObj[key] = transRpxStyleFn(parsedStyleObj[key])
-          }
-        })
-      }
-      return parsedStyleObj
-    })
-
     const routes = []
 
     for (const pagePath in pagesMap) {
@@ -384,8 +339,8 @@ registered in parent context!`)
     option.mixins = [mixin]
   }
 
-  if (outputPath) {
-    option.componentPath = '/' + outputPath
+  if (componentId) {
+    option.componentPath = '/' + componentId
   }
 
   return option

package/lib/selector.js

@@ -1,50 +1,31 @@
 const parseComponent = require('./parser')
-const parseRequest = require('./utils/parse-request')
+const loaderUtils = require('loader-utils')
+const getMainCompilation = require('./utils/get-main-compilation')
 
 module.exports = function (content) {
   this.cacheable()
-  // todo 移除mpx访问依赖，支持thread-loader
-  const mpx = this.getMpx()
+  const mainCompilation = getMainCompilation(this._compilation)
+  const mpx = mainCompilation.__mpx__
   if (!mpx) {
     return content
   }
-  const { queryObj } = parseRequest(this.resource)
-  const ctorType = queryObj.ctorType
-  const type = queryObj.type
-  const index = queryObj.index || 0
   const mode = mpx.mode
   const env = mpx.env
+  const defs = mpx.defs
+  const query = loaderUtils.getOptions(this) || {}
   const filePath = this.resourcePath
   const parts = parseComponent(content, {
     filePath,
     needMap: this.sourceMap,
     mode,
+    defs,
     env
   })
-  let part = parts[type]
+  let part = parts[query.type] || {}
   if (Array.isArray(part)) {
-    part = part[index]
-  }
-  if (!part) {
-    let content = ''
-    // 补全js内容
-    if (type === 'script') {
-      switch (ctorType) {
-        case 'app':
-          content += 'import {createApp} from "@mpxjs/core"\n' +
-            'createApp({})\n'
-          break
-        case 'page':
-          content += 'import {createPage} from "@mpxjs/core"\n' +
-            'createPage({})\n'
-          break
-        case 'component':
-          content += 'import {createComponent} from "@mpxjs/core"\n' +
-            'createComponent({})\n'
-      }
+    part = part[query.index] || {
+      content: ''
     }
-    part = { content }
   }
-  part = part || { content: '' }
   this.callback(null, part.content, part.map)
 }

package/lib/staticConfig.js

@@ -0,0 +1,4 @@
+module.exports = {
+  MPX_ROOT_VIEW: 'mpx-root-view', // 根节点类名
+  MPX_APP_MODULE_ID: 'mpx-app-scope' // app文件moduleId
+}

package/lib/style-compiler/index.js

@@ -1,29 +1,35 @@
+const getMainCompilation = require('../utils/get-main-compilation')
 const postcss = require('postcss')
+const loaderUtils = require('loader-utils')
 const loadPostcssConfig = require('./load-postcss-config')
-const { MPX_ROOT_VIEW, MPX_APP_MODULE_ID } = require('../utils/const')
+const { MPX_ROOT_VIEW, MPX_APP_MODULE_ID } = require('../staticConfig')
 const trim = require('./plugins/trim')
 const rpx = require('./plugins/rpx')
 const vw = require('./plugins/vw')
 const pluginCondStrip = require('./plugins/conditional-strip')
 const scopeId = require('./plugins/scope-id')
 const transSpecial = require('./plugins/trans-special')
-const { matchCondition } = require('../utils/match-condition')
+const matchCondition = require('../utils/match-condition')
 const parseRequest = require('../utils/parse-request')
 
 module.exports = function (css, map) {
   this.cacheable()
   const cb = this.async()
-  const { resourcePath, queryObj } = parseRequest(this.resource)
-  const mpx = this.getMpx()
-  const id = queryObj.moduleId || queryObj.mid || 'm' + mpx.pathHash(resourcePath)
-  const appInfo = mpx.appInfo
+  const loaderOptions = loaderUtils.getOptions(this) || {}
+  const mainCompilation = getMainCompilation(this._compilation)
+  const mpx = mainCompilation.__mpx__
   const defs = mpx.defs
-  const mode = mpx.mode
-  const isApp = resourcePath === appInfo.resourcePath
+  const { resourcePath, queryObj } = parseRequest(this.resource)
+  const packageName = queryObj.packageRoot || mpx.currentPackageRoot || 'main'
+  const componentsMap = mpx.componentsMap[packageName]
+  const pagesMap = mpx.pagesMap
+  const isApp = (!componentsMap[resourcePath] && !pagesMap[resourcePath])
+
   const transRpxRulesRaw = mpx.transRpxRules
+
   const transRpxRules = transRpxRulesRaw ? (Array.isArray(transRpxRulesRaw) ? transRpxRulesRaw : [transRpxRulesRaw]) : []
 
-  const transRpxFn = mpx.webConfig && mpx.webConfig.transRpxFn
+  const transRpxFn = mpx.webConfig.transRpxFn
   const testResolveRange = (include = () => true, exclude) => {
     return matchCondition(this.resourcePath, { include, exclude })
   }
@@ -39,12 +45,14 @@ module.exports = function (css, map) {
       },
       config.options
     )
-    // ali平台下处理scoped和host选择器
-    if (mode === 'ali') {
-      if (queryObj.scoped) {
-        plugins.push(scopeId({ id }))
-      }
-      plugins.push(transSpecial({ id }))
+    // ali环境处理host选择器
+    if (mpx.mode === 'ali') {
+      plugins.push(transSpecial({ id: loaderOptions.moduleId || loaderOptions.mid }))
+    }
+
+    if (loaderOptions.scoped) {
+      const moduleId = loaderOptions.moduleId || loaderOptions.mid
+      plugins.push(scopeId({ id: moduleId }))
     }
 
     plugins.push(pluginCondStrip({
@@ -83,7 +91,7 @@ module.exports = function (css, map) {
       .process(css, options)
       .then(result => {
         // ali环境添加全局样式抹平root差异
-        if (mode === 'ali' && isApp) {
+        if (mpx.mode === 'ali' && isApp) {
           result.css += `\n.${MPX_ROOT_VIEW} { display: initial }\n.${MPX_APP_MODULE_ID} { line-height: normal }`
         }
         if (result.messages) {

package/lib/style-compiler/load-postcss-config.js

@@ -16,9 +16,7 @@ module.exports = function loadPostcssConfig (loaderContext, inlineConfig = {}) {
       webpack: loaderContext,
       defs: inlineConfig.defs || {}
     }
-    loaded = load(ctx, config.path, {
-      loaders: { '.json': (_, content) => JSON.parse(content) }
-    }).catch(err => {
+    loaded = load(ctx, config.path, { argv: false }).catch(err => {
       // postcss-load-config throws error when no config file is found,
       // but for us it's optional. only emit other errors
       if (err.message.indexOf('No PostCSS Config found') >= 0) {

package/lib/style-compiler/plugins/conditional-strip.js

@@ -1,3 +1,5 @@
+const postcss = require('postcss')
+
 /**
  * 按平台条件编译CSS，用法如下：
  * @type {postcss.Plugin<any>}
@@ -42,7 +44,7 @@
 //     @mpx-endif
 //     */
 // `
-module.exports = (options = {}) => {
+module.exports = postcss.plugin('conditional-strip', (options = {}) => {
   const { defs } = options
 
   const defKeys = Object.keys(defs)
@@ -89,76 +91,71 @@ module.exports = (options = {}) => {
     return parseCondition(/@mpx-elif[^(]*?\(([\s\S]*)\)/, content)
   }
 
-  return {
-    postcssPlugin: 'conditional-strip',
-    Once (root) {
-      const condsStacks = []
-      const currentConds = []
-      let curDepth = -1
+  return function (root, result) {
+    const condsStacks = []
+    const currentConds = []
+    let curDepth = -1
 
-      root.walk(node => {
-        let isKeyword = false
-        if (node.type === 'comment') {
-          const { text } = node
-          if (isIfStart(text)) {
-            isKeyword = true
-            const cond = parseIf(text)
-            curDepth++
-            const parentCond = currentConds[curDepth - 1]
-            if (parentCond && parentCond.shouldRemove) {
-              cond.shouldRemove = true
-            }
-            cond.children.push(node)
-            condsStacks.push({
-              if: cond
-            })
-            currentConds[curDepth] = cond
-          } else if (isElseIf(text)) {
-            isKeyword = true
-            const cond = parseElseIf(text)
-            const parentCond = currentConds[curDepth - 1]
-            if (parentCond && parentCond.shouldRemove) {
-              cond.shouldRemove = true
-            }
-            cond.children.push(node)
-            condsStacks[curDepth].elif = cond
-            currentConds[curDepth] = cond
-          } else if (isElse(text)) {
-            isKeyword = true
-            const curConds = condsStacks[curDepth]
-            const cond = {
-              shouldRemove: !(curConds.if.shouldRemove && (!curConds.elif || curConds.elif.shouldRemove)),
-              children: [node]
-            }
-            const parentCond = currentConds[curDepth - 1]
-            if (parentCond && parentCond.shouldRemove) {
-              cond.shouldRemove = true
-            }
-            condsStacks[curDepth].else = cond
-            currentConds[curDepth] = cond
-          } else if (isEndIf(text)) {
-            isKeyword = true
-            const curConds = condsStacks.pop()
-            Object.keys(curConds).forEach(k => {
-              curConds[k].children.forEach(node => {
-                node.remove()
-              })
-            })
-            currentConds.pop()
-            curDepth--
-            node.remove()
+    root.walk(node => {
+      let isKeyword = false
+      if (node.type === 'comment') {
+        const { text } = node
+        if (isIfStart(text)) {
+          isKeyword = true
+          const cond = parseIf(text)
+          curDepth++
+          const parentCond = currentConds[curDepth - 1]
+          if (parentCond && parentCond.shouldRemove) {
+            cond.shouldRemove = true
+          }
+          cond.children.push(node)
+          condsStacks.push({
+            if: cond
+          })
+          currentConds[curDepth] = cond
+        } else if (isElseIf(text)) {
+          isKeyword = true
+          const cond = parseElseIf(text)
+          const parentCond = currentConds[curDepth - 1]
+          if (parentCond && parentCond.shouldRemove) {
+            cond.shouldRemove = true
+          }
+          cond.children.push(node)
+          condsStacks[curDepth].elif = cond
+          currentConds[curDepth] = cond
+        } else if (isElse(text)) {
+          isKeyword = true
+          const curConds = condsStacks[curDepth]
+          const cond = {
+            shouldRemove: !(curConds.if.shouldRemove && (!curConds.elif || curConds.elif.shouldRemove)),
+            children: [node]
           }
+          const parentCond = currentConds[curDepth - 1]
+          if (parentCond && parentCond.shouldRemove) {
+            cond.shouldRemove = true
+          }
+          condsStacks[curDepth].else = cond
+          currentConds[curDepth] = cond
+        } else if (isEndIf(text)) {
+          isKeyword = true
+          const curConds = condsStacks.pop()
+          Object.keys(curConds).forEach(k => {
+            curConds[k].children.forEach(node => {
+              node.remove()
+            })
+          })
+          currentConds.pop()
+          curDepth--
+          node.remove()
         }
+      }
 
-        if (!isKeyword) {
-          const curCond = currentConds[curDepth]
-          if (curCond && curCond.shouldRemove) {
-            curCond.children.push(node)
-          }
+      if (!isKeyword) {
+        const curCond = currentConds[curDepth]
+        if (curCond && curCond.shouldRemove) {
+          curCond.children.push(node)
         }
-      })
-    }
+      }
+    })
   }
-}
-
-module.exports.postcss = true
+})