@mpxjs/webpack-plugin 2.9.41 → 2.9.43

package/lib/index.js

@@ -27,6 +27,7 @@ const ExternalsPlugin = require('webpack/lib/ExternalsPlugin')
 const AddModePlugin = require('./resolver/AddModePlugin')
 const AddEnvPlugin = require('./resolver/AddEnvPlugin')
 const PackageEntryPlugin = require('./resolver/PackageEntryPlugin')
+const DynamicRuntimePlugin = require('./resolver/DynamicRuntimePlugin')
 const FixDescriptionInfoPlugin = require('./resolver/FixDescriptionInfoPlugin')
 // const CommonJsRequireDependency = require('webpack/lib/dependencies/CommonJsRequireDependency')
 // const HarmonyImportSideEffectDependency = require('webpack/lib/dependencies/HarmonyImportSideEffectDependency')
@@ -343,6 +344,9 @@ class MpxWebpackPlugin {
     if (this.options.env) {
       compiler.options.resolve.plugins.push(addEnvPlugin)
     }
+    if (this.options.dynamicRuntime) {
+      compiler.options.resolve.plugins.push(new DynamicRuntimePlugin('before-file', 'file'))
+    }
     compiler.options.resolve.plugins.push(packageEntryPlugin)
     compiler.options.resolve.plugins.push(new FixDescriptionInfoPlugin())
     compiler.options.resolve.plugins.push(dynamicPlugin)

package/lib/json-compiler/index.js

@@ -578,12 +578,12 @@ module.exports = function (content) {
         const srcCustomKey = config[srcMode].tabBar.customKey
         const srcPath = resolveTabBarPath(srcCustomKey)
         const outputPath = resolveTabBarPath(outputCustomKey)
-        const dynamicEntryExtraOptions = {
-          // replace with true for custom-tab-bar
-          replaceContent: 'true'
-        }
-
-        processComponent(`./${srcPath}`, context, { outputPath, extraOptions: dynamicEntryExtraOptions }, (err, entry) => {
+        processComponent(`./${srcPath}`, context, {
+          outputPath,
+          extraOptions: {
+            replaceContent: 'true'
+          }
+        }, (err, entry) => {
           if (err === RESOLVE_IGNORED_ERR) {
             delete tabBar[srcCustomKey]
             return callback()
@@ -597,6 +597,26 @@ module.exports = function (content) {
       }
     }
 
+    const processAppBar = (appBar, context, callback) => {
+      if (appBar) {
+        processComponent('./app-bar/index', context, {
+          outputPath: 'app-bar/index',
+          extraOptions: {
+            replaceContent: 'true'
+          }
+        }, (err, entry) => {
+          if (err === RESOLVE_IGNORED_ERR) {
+            return callback()
+          }
+          if (err) return callback(err)
+          appBar.custom = entry // hack for javascript parser call hook.
+          callback()
+        })
+      } else {
+        callback()
+      }
+    }
+
     const processPluginGenericsImplementation = (plugin, context, tarRoot, callback) => {
       if (!plugin.genericsImplementation) return callback()
       const relativePath = useRelativePath ? publicPath + tarRoot : ''
@@ -673,6 +693,9 @@ module.exports = function (content) {
       },
       (callback) => {
         processSubPackages(json.subPackages || json.subpackages, this.context, callback)
+      },
+      (callback) => {
+        processAppBar(json.appBar, this.context, callback)
       }
     ], (err) => {
       if (err) return callback(err)

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

@@ -59,8 +59,8 @@ module.exports = function getSpec ({ warn, error }) {
     color: 'color',
     default: 'default' // 不校验
   }
-  // number 类型支持的单位
-  const numberRegExp = /^\s*(\d+(\.\d+)?)(rpx|px|%)?\s*$/
+  // number 类型支持的单位(包含auto)
+  const numberRegExp = /^\s*((\d+(\.\d+)?)(rpx|px|%)?)|(auto)\s*$/
   // RN 不支持的颜色格式
   const colorRegExp = /^\s*(lab|lch|oklab|oklch|color-mix|color|hwb|lch|light-dark).*$/
 
@@ -70,8 +70,8 @@ module.exports = function getSpec ({ warn, error }) {
       case ValueType.color: {
         const isNumber = numberRegExp.test(value)
         const isUnsupporttedColor = colorRegExp.test(value)
-        isNumber && warn(`React Native property [${prop}]'s valueType is ${valueType}, we does not set type number`)
-        isUnsupporttedColor && warn('React Native color does not support type [lab,lch,oklab,oklch,color-mix,color,hwb,lch,light-dark]')
+        isNumber && warn(`Property [${prop}] receives a valid color as value, not a number.`)
+        isUnsupporttedColor && warn('React Native\'s supported color format does not contain [lab,lch,oklab,oklch,color-mix,color,hwb,lch,light-dark].')
         return !isNumber && !isUnsupporttedColor
       }
       case ValueType.number: {
@@ -392,17 +392,17 @@ module.exports = function getSpec ({ warn, error }) {
         ios: getAbbreviation,
         android: getAbbreviation
       },
+      { // line-height 换算
+        test: 'line-height',
+        ios: formatLineHeight,
+        android: formatLineHeight
+      },
       // 值类型校验放到最后
       { // color 颜色值校验
         test: /.*color.*/i,
         ios: checkCommonValue(ValueType.color),
         android: checkCommonValue(ValueType.color)
       },
-      { // color 颜色值校验
-        test: 'line-height',
-        ios: formatLineHeight,
-        android: formatLineHeight
-      },
       { // number 值校验
         test: /.*width|height|left|right|top|bottom|radius|margin|padding|spacing|offset|size.*/i,
         ios: checkCommonValue(ValueType.number),

package/lib/react/script-helper.js

@@ -93,10 +93,11 @@ function buildGlobalParams ({
   if (ctorType === 'app') {
     content += `
 global.getApp = function () {}
-global.getCurrentPages = function () {}
+global.getCurrentPages = function () { return [] }
 global.__networkTimeout = ${JSON.stringify(jsonConfig.networkTimeout)}
 global.__mpxGenericsMap = {}
 global.__mpxOptionsMap = {}
+global.__mpxPagesMap = {}
 global.__style = ${JSON.stringify(jsonConfig.style || 'v1')}
 global.__mpxPageConfig = ${JSON.stringify(jsonConfig.window)}
 global.__getAppComponents = function () {

package/lib/resolver/DynamicRuntimePlugin.js

@@ -0,0 +1,25 @@
+const { matchCondition } = require('../utils/match-condition')
+
+const matcher = {
+  include: ['@mpxjs/core/src/dynamic/dynamicRenderMixin.empty.js']
+}
+
+module.exports = class DynamicRuntimePlugin {
+  constructor (source, target) {
+    this.source = source
+    this.target = target
+  }
+
+  apply (resolver) {
+    const target = resolver.ensureHook(this.target)
+    resolver.getHook(this.source).tapAsync('DynamicRuntimePlugin', (request, resolveContext, callback) => {
+      const resourcePath = request.path
+      if (matchCondition(resourcePath, matcher)) {
+        request.path = resourcePath.replace(/\.empty/, '')
+        resolver.doResolve(target, request, 'resolve dynamicRenderMixin file', resolveContext, callback)
+      } else {
+        callback()
+      }
+    })
+  }
+}

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

@@ -110,7 +110,7 @@
       this.debounceRefresh = debounce(function () {
         this.refresh()
       }, 200, {
-        leading: false,
+        leading: true,
         trailing: true
       })
       this.dispatchScrollTo = throttle(function (direction) {

package/lib/runtime/oc.wxs

@@ -1,15 +1,14 @@
 // 可选链wxs
 module.exports.g = function (val, valKeyArr) {
     var res = val
-    if (typeof val !== 'object') {
-        return undefined
-    }
     var len = valKeyArr.length
     var i = 0
     while (i < len) {
-        if ((res = res[valKeyArr[i]]) === undefined) {
+        if (typeof res !== 'object' || res === null) {
+            res = undefined
             break
         }
+        res = res[valKeyArr[i]]
         i++
     }
     return res

package/lib/runtime/stringify.wxs

@@ -137,9 +137,9 @@ function stringifyArray (value) {
   return res
 }
 
-var mpxDashReg = genRegExp('(.+)MpxDash$')
-// 转义字符在wxs正则中存在平台兼容性问题，用[$]规避使用转义字符
-var mpxDashReplaceReg = genRegExp('[$]', 'g')
+var mpxEscapeReg = genRegExp('(.+)MpxEscape$')
+var dashEscapeReg = genRegExp('_da_', 'g')
+var spaceEscapeReg = genRegExp('_sp_', 'g')
 
 function stringifyObject (value) {
   var res = ''
@@ -148,8 +148,8 @@ function stringifyObject (value) {
     var key = objKeys[i]
     if (value[key]) {
       if (res) res += ' '
-      if (mpxDashReg.test(key)) {
-        key = mpxDashReg.exec(key)[1].replace(mpxDashReplaceReg, '-')
+      if (mpxEscapeReg.test(key)) {
+        key = mpxEscapeReg.exec(key)[1].replace(dashEscapeReg, '-').replace(spaceEscapeReg, ' ')
       }
       res += key
     }

package/lib/template-compiler/bind-this.js

@@ -127,12 +127,8 @@ function checkDelAndGetPath (path) {
     }
 
     if (t.isMemberExpression(parent) && parent.computed) {
-      if (key === 'property') {
-        replace = true
-      } else {
-        canDel = false
-        break
-      }
+      canDel = false
+      break
     }
 
     if (t.isLogicalExpression(parent)) { // case: a || ((b || c) && d)

package/lib/template-compiler/compiler.js

@@ -1654,9 +1654,10 @@ function processFor (el) {
   }
 }
 
-function processRefReact (el, options, meta) {
+function processRefReact (el, meta) {
   const val = getAndRemoveAttr(el, config[mode].directive.ref).val
-  const type = isComponentNode(el, options) ? 'component' : 'node'
+  // rn中只有内建组件能被作为node ref处理
+  const type = el.isBuiltIn ? 'node' : 'component'
   if (val) {
     if (!meta.refs) {
       meta.refs = []
@@ -1949,7 +1950,7 @@ function processText (el) {
 // RN中文字需被Text包裹
 function processWrapTextReact (el) {
   const parentTag = el.parent.tag
-  if (parentTag !== 'mpx-text' && parentTag !== 'Text') {
+  if (parentTag !== 'mpx-text' && parentTag !== 'Text' && parentTag !== 'wxs') {
     const wrapper = createASTElement('Text')
     replaceNode(el, wrapper, true)
     addChild(wrapper, el)
@@ -1970,7 +1971,7 @@ function processWrapTextReact (el) {
 // }
 
 function injectWxs (meta, module, src) {
-  if (runtimeCompile || addWxsModule(meta, module, src)) {
+  if (runtimeCompile || addWxsModule(meta, module, src) || isReact(mode)) {
     return
   }
 
@@ -2522,7 +2523,7 @@ function processElement (el, root, options, meta) {
     // 预处理代码维度条件编译
     processIf(el)
     processFor(el)
-    processRefReact(el, options, meta)
+    processRefReact(el, meta)
     processStyleReact(el)
     processEventReact(el, options, meta)
     processComponentIs(el, options)
@@ -2573,6 +2574,7 @@ function closeElement (el, meta, options) {
     return
   }
   if (isReact(mode)) {
+    postProcessWxs(el, meta)
     postProcessForReact(el)
     postProcessIfReact(el)
     return

package/lib/template-compiler/trans-dynamic-class-expr.js

@@ -2,6 +2,7 @@ const babylon = require('@babel/parser')
 const t = require('@babel/types')
 const traverse = require('@babel/traverse').default
 const generate = require('@babel/generator').default
+const isValidIdentifierStr = require('../utils/is-valid-identifier-str')
 const escapeReg = /[()[\]{}#!.:,%'"+$]/g
 const escapeMap = {
   '(': '_pl_',
@@ -31,6 +32,12 @@ function mpEscape (str) {
   })
 }
 
+function keyEscape (str) {
+  let result = str.replace(/-/g, '_da_').replace(/\s+/g, '_sp_')
+  if (result !== str) result += 'MpxEscape'
+  return result
+}
+
 module.exports = function transDynamicClassExpr (expr, { error } = {}) {
   try {
     const ast = babylon.parse(expr, {
@@ -42,10 +49,10 @@ module.exports = function transDynamicClassExpr (expr, { error } = {}) {
       ObjectExpression (path) {
         path.node.properties.forEach((property) => {
           if (t.isObjectProperty(property) && !property.computed) {
-            let propertyName = property.key.name || property.key.value
-            propertyName = mpEscape(propertyName)
-            if (/-/.test(propertyName)) {
-              property.key = t.identifier(propertyName.replace(/-/g, '$$') + 'MpxDash')
+            const rawPropertyName = property.key.name || property.key.value
+            const propertyName = keyEscape(mpEscape(rawPropertyName))
+            if (!isValidIdentifierStr(propertyName)) {
+              error && error(`Dynamic classname [${rawPropertyName}] can not be escaped as a valid identifier, which is not supported.`)
             } else {
               property.key = t.identifier(propertyName)
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.9.41",
+  "version": "2.9.43",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -85,5 +85,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "0b3ee5d2c1b6c6e0af6a842eb4e12f4a1173c067"
+  "gitHead": "92a347518d15400f87c380bc7248b8b6254631cf"
 }