@mpxjs/webpack-plugin 2.9.66 → 2.9.67

package/lib/runtime/components/react/useAnimationHooks.ts

@@ -16,9 +16,6 @@ import {
 import { ExtendedViewStyle } from './types/common'
 import type { _ViewProps } from './mpx-view'
 
-// type TransformKey = 'translateX' | 'translateY' | 'rotate' | 'rotateX' | 'rotateY' | 'rotateZ' | 'scaleX' | 'scaleY' | 'skewX' | 'skewY'
-// type NormalKey = 'opacity' | 'backgroundColor' | 'width' | 'height' | 'top' | 'right' | 'bottom' | 'left' | 'transformOrigin'
-// type RuleKey = TransformKey | NormalKey
 type AnimatedOption = {
   duration: number
   delay: number
@@ -84,20 +81,79 @@ const InitialValue: ExtendedViewStyle = Object.assign({
   transformOrigin: ['50%', '50%', 0]
 }, TransformInitial)
 const TransformOrigin = 'transformOrigin'
-// deg 角度
-// const isDeg = (key: RuleKey) => ['rotateX', 'rotateY', 'rotateZ', 'rotate', 'skewX', 'skewY'].includes(key)
-// 背景色
-// const isBg = (key: RuleKey) => key === 'backgroundColor'
 // transform
 const isTransform = (key: string) => Object.keys(TransformInitial).includes(key)
+// parse string transform, eg: transform: 'rotateX(45deg) rotateZ(0.785398rad)'
+const parseTransform = (transformStr: string) => {
+  const values = transformStr.trim().split(/\s+/)
+  const transform: {[propName: string]: string|number|number[]}[] = []
+  values.forEach(item => {
+    const match = item.match(/([/\w]+)\(([^)]+)\)/)
+    if (match && match.length >= 3) {
+      let key = match[1]
+      const val = match[2]
+      switch (key) {
+        case 'translateX':
+        case 'translateY':
+        case 'scaleX':
+        case 'scaleY':
+        case 'rotateX':
+        case 'rotateY':
+        case 'rotateZ':
+        case 'rotate':
+        case 'skewX':
+        case 'skewY':
+        case 'perspective':
+          // 单个值处理
+          transform.push({ [key]: global.__formatValue(val) })
+          break
+        case 'matrix':
+        case 'matrix3d':
+          transform.push({ [key]: val.split(',').map(val => +val) })
+          break
+        case 'translate':
+        case 'scale':
+        case 'skew':
+        case 'rotate3d': // x y z angle
+        case 'translate3d': // x y 支持 z不支持
+        case 'scale3d': // x y 支持 z不支持
+        {
+          // 2 个以上的值处理
+          key = key.replace('3d', '')
+          const vals = val.split(',', key === 'rotate' ? 4 : 3)
+          // scale(.5) === scaleX(.5) scaleY(.5) 这里处理一下
+          if (vals.length === 1 && key === 'scale') {
+            vals.push(vals[0])
+          }
+          const xyz = ['X', 'Y', 'Z']
+          transform.push(...vals.map((v, index) => {
+            return { [`${key}${xyz[index] || ''}`]: global.__formatValue(v.trim()) }
+          }))
+          break
+        }
+      }
+    }
+  })
+  return transform
+}
+// format style
+const formatStyle = (style: ExtendedViewStyle): ExtendedViewStyle => {
+  if (!style.transform || Array.isArray(style.transform)) return style
+  return Object.assign({}, style, {
+    transform: parseTransform(style.transform)
+  })
+}
 
 export default function useAnimationHooks<T, P> (props: _ViewProps) {
-  const { style: originalStyle = {}, animation } = props
+  const { style = {}, animation } = props
+  const originalStyle = formatStyle(style)
   // id 标识
   const id = animation?.id || -1
   // 有动画样式的 style key
   const animatedStyleKeys = useSharedValue([] as (string|string[])[])
-  const animatedKeys = useRef({} as {[propName: keyof ExtendedViewStyle]: Boolean})
+  // 记录动画key的style样式值 没有的话设置为false
+  const animatedKeys = useRef({} as {[propName: keyof ExtendedViewStyle]: boolean})
+  // const animatedKeys = useRef({} as {[propName: keyof ExtendedViewStyle]: boolean|number|string})
   // ** 全量 style prop sharedValue
   // 不能做增量的原因：
   // 1 尝试用 useRef，但 useAnimatedStyle 访问后的 ref 不能在增加新的值，被冻结
@@ -119,6 +175,16 @@ export default function useAnimationHooks<T, P> (props: _ViewProps) {
     // 驱动动画
     createAnimation(keys)
   }, [id])
+  // 同步style更新
+  // useEffect(() => {
+  //   Object.keys(animatedKeys.current).forEach(key => {
+  //     const originVal = getOriginalStyleVal(key, isTransform(key))
+  //     if (originVal && animatedKeys.current[key] !== originVal) {
+  //       animatedKeys.current[key] = originVal
+  //       shareValMap[key].value = originVal
+  //     }
+  //   })
+  // }, [style])
   // ** 清空动画
   useEffect(() => {
     return () => {
@@ -152,9 +218,9 @@ export default function useAnimationHooks<T, P> (props: _ViewProps) {
       }
       // 添加每个key的多次step动画
       animatedKeys.forEach(key => {
-        let toVal = (rules.get(key) || transform.get(key)) as number|string
+        let toVal = (rules.get(key) || transform.get(key))
         // key不存在，第一轮取shareValMap[key]value，非第一轮取上一轮的
-        if (!toVal) {
+        if (toVal === undefined) {
           toVal = index > 0 ? lastValueMap[key] : shareValMap[key].value
         }
         const animation = getAnimation({ key, value: toVal }, { delay, duration, easing }, needSetCallback ? setTransformOrigin : undefined)
@@ -181,9 +247,8 @@ export default function useAnimationHooks<T, P> (props: _ViewProps) {
       : withTiming(value, { duration, easing })
     return delay ? withDelay(delay, animation) : animation
   }
-  // 获取初始值（prop style or 默认值）
   function getInitialVal (key: keyof ExtendedViewStyle, isTransform = false) {
-    if (isTransform && originalStyle.transform?.length) {
+    if (isTransform && Array.isArray(originalStyle.transform)) {
       let initialVal = InitialValue[key]
       // 仅支持 { transform: [{rotateX: '45deg'}, {rotateZ: '0.785398rad'}] } 格式的初始样式
       originalStyle.transform.forEach(item => {
@@ -193,12 +258,31 @@ export default function useAnimationHooks<T, P> (props: _ViewProps) {
     }
     return originalStyle[key] === undefined ? InitialValue[key] : originalStyle[key]
   }
+  // 从 prop style 中获取样式初始值 没有为undefined
+  // function getOriginalStyleVal (key: keyof ExtendedViewStyle, isTransform = false) {
+  //   if (isTransform && Array.isArray(originalStyle.transform)) {
+  //     let initialVal = undefined // InitialValue[key]
+  //     // 仅支持 { transform: [{rotateX: '45deg'}, {rotateZ: '0.785398rad'}] } 格式的初始样式
+  //     originalStyle.transform.forEach(item => {
+  //       if (item[key] !== undefined) initialVal = item[key]
+  //     })
+  //     return initialVal
+  //   }
+  //   return originalStyle[key] // === undefined ? InitialValue[key] : originalStyle[key]
+  // }
+  // 获取动画shareVal初始值（prop style or 默认值）
+  // function getInitialVal (key: keyof ExtendedViewStyle, isTransform = false) {
+  //   const originalVal = getOriginalStyleVal(key, isTransform)
+  //   return originalVal === undefined ? InitialValue[key] : originalStyle[key]
+  // }
   // 循环 animation actions 获取所有有动画的 style prop name
   function getAnimatedStyleKeys () {
     return (animation?.actions || []).reduce((keyMap, action) => {
       const { rules, transform } = action
       const ruleArr = [...rules.keys(), ...transform.keys()]
       ruleArr.forEach(key => {
+        // const originalVal = getOriginalStyleVal(key, isTransform(key))
+        // if (!keyMap[key]) keyMap[key] = originalVal === undefined ? false : originalVal
         if (!keyMap[key]) keyMap[key] = true
       })
       return keyMap

package/lib/runtime/components/react/useNodesRef.ts

@@ -1,4 +1,5 @@
 import { useRef, useImperativeHandle, RefObject, ForwardedRef } from 'react'
+import { useAnimatedRef } from 'react-native-reanimated'
 
 type Obj = Record<string, any>
 

package/lib/runtime/components/react/utils.tsx

@@ -12,7 +12,7 @@ export const URL_REGEX = /^\s*url\(["']?(.*?)["']?\)\s*$/
 export const BACKGROUND_REGEX = /^background(Image|Size|Repeat|Position)$/
 export const TEXT_PROPS_REGEX = /ellipsizeMode|numberOfLines/
 export const DEFAULT_FONT_SIZE = 16
-export const DEFAULT_UNLAY_STYLE = {
+export const HIDDEN_STYLE = {
   opacity: 0
 }
 
@@ -99,7 +99,7 @@ export function isText (ele: ReactNode): ele is ReactElement {
   if (isValidElement(ele)) {
     const displayName = (ele.type as ExtendedFunctionComponent)?.displayName
     const isCustomText = (ele.type as ExtendedFunctionComponent)?.isCustomText
-    return displayName === 'mpx-text' || displayName === 'Text' || !!isCustomText
+    return displayName === 'MpxText' || displayName === 'Text' || !!isCustomText
   }
   return false
 }
@@ -474,7 +474,7 @@ interface LayoutConfig {
 export const useLayout = ({ props, hasSelfPercent, setWidth, setHeight, onLayout, nodeRef }: LayoutConfig) => {
   const layoutRef = useRef({})
   const hasLayoutRef = useRef(false)
-  const layoutStyle: Record<string, any> = !hasLayoutRef.current && hasSelfPercent ? DEFAULT_UNLAY_STYLE : {}
+  const layoutStyle: Record<string, any> = !hasLayoutRef.current && hasSelfPercent ? HIDDEN_STYLE : {}
   const layoutProps: Record<string, any> = {}
   const enableOffset = props['enable-offset']
   if (hasSelfPercent || onLayout || enableOffset) {
@@ -524,3 +524,18 @@ export function wrapChildren (props: Record<string, any> = {}, { hasVarDec, varC
   }
   return children
 }
+
+export interface GestureHandler {
+  nodeRefs?: Array<{ getNodeInstance: () => { nodeRef: unknown } }>;
+  current?: unknown;
+}
+
+export function flatGesture (gestures: Array<GestureHandler> = []) {
+  return (gestures && gestures.flatMap((gesture: GestureHandler) => {
+    if (gesture && gesture.nodeRefs) {
+      return gesture.nodeRefs
+        .map((item: { getNodeInstance: () => any }) => item.getNodeInstance()?.instance?.gestureRef || {})
+    }
+    return gesture?.current ? [gesture] : []
+  })) || []
+}

package/lib/runtime/optionProcessorReact.js

@@ -4,18 +4,3 @@ export function getComponent (component, extendOptions) {
   if (extendOptions) Object.assign(component, extendOptions)
   return component
 }
-
-export function createApp ({
-  App,
-  pagesMap,
-  firstPage,
-  createElement,
-  NavigationContainer,
-  createNativeStackNavigator
-}) {
-  const Stack = createNativeStackNavigator()
-  const pages = []
-  return () => {
-    return createElement(NavigationContainer, null, createElement(Stack.Navigator, null, ...pages))
-  }
-}

package/lib/runtime/swanHelper.wxs

@@ -23,7 +23,7 @@ module.exports = {
       }
       return list
     }
-    if ( typeof value === 'string') {
+    if (typeof value === 'string') {
       return value.split('')
     }
     return value

package/lib/style-compiler/index.js

@@ -19,7 +19,7 @@ module.exports = function (css, map) {
   const { resourcePath, queryObj } = parseRequest(this.resource)
   const mpx = this.getMpx()
   const mpxStyleOptions = (queryObj.mpxStyleOptions && JSON.parse(queryObj.mpxStyleOptions)) || {}
-  const id = queryObj.moduleId || mpxStyleOptions.mid || '_' + mpx.pathHash(resourcePath)
+  const id = queryObj.moduleId || mpxStyleOptions.mid || mpx.getModuleId(resourcePath)
   const appInfo = mpx.appInfo
   const defs = mpx.defs
   const mode = mpx.mode

package/lib/style-compiler/plugins/scope-id.js

@@ -20,6 +20,7 @@ module.exports = ({ id }) => {
           }
           return
         }
+        if (node.selector === ':host') return
         node.selector = selectorParser(selectors => {
           selectors.each(selector => {
             let node = null

package/lib/template-compiler/compiler.js

@@ -116,6 +116,7 @@ let i18nInjectableComputed = []
 let hasOptionalChaining = false
 let processingTemplate = false
 const rulesResultMap = new Map()
+let usingComponents = []
 
 function updateForScopesMap () {
   forScopesMap = {}
@@ -633,6 +634,9 @@ function parse (template, options) {
   processingTemplate = false
   rulesResultMap.clear()
 
+  if (typeof options.usingComponentsInfo === 'string') options.usingComponentsInfo = JSON.parse(options.usingComponentsInfo)
+  usingComponents = Object.keys(options.usingComponentsInfo)
+
   const _warn = content => {
     const currentElementRuleResult = rulesResultMap.get(currentEl) || rulesResultMap.set(currentEl, {
       warnArray: [],
@@ -654,7 +658,7 @@ function parse (template, options) {
     type: 'template',
     testKey: 'tag',
     data: {
-      usingComponents: options.usingComponents
+      usingComponents
     },
     warn: _warn,
     error: _error
@@ -804,7 +808,7 @@ function parse (template, options) {
 
   if (!tagNames.has('component') && options.checkUsingComponents) {
     const arr = []
-    options.usingComponents.forEach((item) => {
+    usingComponents.forEach((item) => {
       if (!tagNames.has(item) && !options.globalComponents.includes(item) && !options.componentPlaceholder.includes(item)) {
         arr.push(item)
       }
@@ -980,7 +984,7 @@ function processComponentIs (el, options) {
 
   const range = getAndRemoveAttr(el, 'range').val
   const isInRange = makeMap(range || '')
-  el.components = (options.usingComponents || []).filter(i => {
+  el.components = (usingComponents).filter(i => {
     if (!range) return true
     return isInRange(i)
   })
@@ -1763,6 +1767,15 @@ function processRefReact (el, meta) {
       value: `{{ this.__getRefVal('${type}', [${selectorsConf}]) }}`
     }])
   }
+
+  if (el.tag === 'mpx-scroll-view' && el.attrsMap['scroll-into-view']) {
+    addAttrs(el, [
+      {
+        name: '__selectRef',
+        value: '{{ this.__selectRef.bind(this) }}'
+      }
+    ])
+  }
 }
 
 function processRef (el, options, meta) {
@@ -2137,7 +2150,7 @@ function processStyle (el, meta) {
 }
 
 function isRealNode (el) {
-  const virtualNodeTagMap = ['block', 'template', 'import', config[mode].wxs.tag].reduce((map, item) => {
+  const virtualNodeTagMap = ['block', 'template', 'import', 'slot', config[mode].wxs.tag].reduce((map, item) => {
     map[item] = true
     return map
   }, {})
@@ -2145,7 +2158,11 @@ function isRealNode (el) {
 }
 
 function isComponentNode (el, options) {
-  return options.usingComponents.indexOf(el.tag) !== -1 || el.tag === 'component'
+  return usingComponents.indexOf(el.tag) !== -1 || el.tag === 'component'
+}
+
+function isReactComponent (el, options) {
+  return !isComponentNode(el, options) && isRealNode(el) && !el.isBuiltIn
 }
 
 function processExternalClasses (el, options) {
@@ -2263,8 +2280,10 @@ function postProcessAliComponentRootView (el, options, meta) {
     { condition: /^style$/, action: 'move' },
     { condition: /^slot$/, action: 'move' }
   ]
+  const tagName = el.tag
+  const mid = options.usingComponentsInfo[tagName]?.mid || moduleId
   const processAppendAttrsRules = [
-    { name: 'class', value: `${MPX_ROOT_VIEW} host-${moduleId}` }
+    { name: 'class', value: `${MPX_ROOT_VIEW} host-${mid}` }
   ]
   const newAttrs = []
   const allAttrs = cloneAttrsList(el.attrsList)
@@ -2594,16 +2613,19 @@ function processElement (el, root, options, meta) {
   }
 
   if (isReact(mode)) {
+    const pass = isReactComponent(el, options)
     // 收集内建组件
     processBuiltInComponents(el, meta)
     // 预处理代码维度条件编译
     processIf(el)
     processFor(el)
-    processRefReact(el, meta)
-    processStyleReact(el, options)
-    processEventReact(el)
-    processComponentIs(el, options)
-    processSlotReact(el, meta)
+    if (!pass) {
+      processRefReact(el, meta)
+      processStyleReact(el, options)
+      processEventReact(el)
+      processComponentIs(el, options)
+      processSlotReact(el, meta)
+    }
     processAttrs(el, options)
     return
   }
@@ -2656,11 +2678,19 @@ function closeElement (el, meta, options) {
   }
 
   const isTemplate = postProcessTemplate(el) || processingTemplate
-  if (!isNative && !isTemplate) {
-    if (isComponentNode(el, options) && !hasVirtualHost && mode === 'ali') {
+  if (!isTemplate) {
+    if (!isNative) {
+      postProcessComponentIs(el, (child) => {
+        if (!hasVirtualHost && mode === 'ali') {
+          postProcessAliComponentRootView(child, options)
+        } else {
+          postProcessIf(child)
+        }
+      })
+    }
+    if (isComponentNode(el, options) && !hasVirtualHost && mode === 'ali' && el.tag !== 'component') {
       postProcessAliComponentRootView(el, options, meta)
     }
-    postProcessComponentIs(el)
   }
 
   if (runtimeCompile) {
@@ -2707,7 +2737,7 @@ function cloneAttrsList (attrsList) {
   })
 }
 
-function postProcessComponentIs (el) {
+function postProcessComponentIs (el, postProcessChild) {
   if (el.is && el.components) {
     let tempNode
     if (el.for || el.if || el.elseif || el.else) {
@@ -2729,7 +2759,7 @@ function postProcessComponentIs (el) {
       })
       newChild.exps = el.exps
       addChild(tempNode, newChild)
-      postProcessIf(newChild)
+      postProcessChild(newChild)
     })
 
     if (!el.parent) {

package/lib/template-compiler/index.js

@@ -24,14 +24,14 @@ module.exports = function (raw) {
   const packageName = queryObj.packageRoot || mpx.currentPackageRoot || 'main'
   const wxsContentMap = mpx.wxsContentMap
   const optimizeRenderRules = mpx.optimizeRenderRules
-  const usingComponents = queryObj.usingComponents || []
+  const usingComponentsInfo = queryObj.usingComponentsInfo || {}
   const componentPlaceholder = queryObj.componentPlaceholder || []
   const hasComment = queryObj.hasComment
   const isNative = queryObj.isNative
   const ctorType = queryObj.ctorType
   const hasScoped = queryObj.hasScoped
   const runtimeCompile = queryObj.isDynamic
-  const moduleId = queryObj.moduleId || '_' + mpx.pathHash(resourcePath)
+  const moduleId = queryObj.moduleId || mpx.getModuleId(resourcePath)
 
   let optimizeRenderLevel = 0
   for (const rule of optimizeRenderRules) {
@@ -57,7 +57,6 @@ module.exports = function (raw) {
     warn,
     error,
     runtimeCompile,
-    usingComponents,
     componentPlaceholder,
     hasComment,
     isNative,
@@ -70,11 +69,12 @@ module.exports = function (raw) {
     externalClasses,
     hasScoped,
     moduleId,
+    usingComponentsInfo,
     // 这里需传递resourcePath和wxsContentMap保持一致
     filePath: resourcePath,
     i18n,
     checkUsingComponents: matchCondition(resourcePath, mpx.checkUsingComponentsRules),
-    globalComponents: Object.keys(mpx.usingComponents),
+    globalComponents: Object.keys(mpx.globalComponents),
     forceProxyEvent: matchCondition(resourcePath, mpx.forceProxyEventRules) || runtimeCompile,
     hasVirtualHost: matchCondition(resourcePath, mpx.autoVirtualHostRules),
     dynamicTemplateRuleRunner: mpx.dynamicTemplateRuleRunner

package/lib/utils/pre-process-json.js

@@ -0,0 +1,113 @@
+const RecordGlobalComponentsDependency = require('../dependencies/RecordGlobalComponentsDependency')
+const JSON5 = require('json5')
+const isUrlRequest = require('./is-url-request')
+const parseRequest = require('./parse-request')
+const addQuery = require('./add-query')
+const resolve = require('./resolve')
+const getJSONContent = require('./get-json-content')
+const getRulesRunner = require('../platform')
+const async = require('async')
+
+module.exports = function ({
+  json,
+  srcMode,
+  emitWarning,
+  emitError,
+  ctorType,
+  resourcePath,
+  loaderContext
+}, callback) {
+  const mpx = loaderContext.getMpx()
+  const context = loaderContext.context
+  const mode = mpx.mode
+  const pagesMap = mpx.pagesMap
+  async.waterfall([
+    (callback) => {
+      getJSONContent(json, null, loaderContext, callback)
+    },
+    (jsonContent, callback) => {
+      if (!jsonContent) return callback(null, {})
+      let componentPlaceholder = []
+      let componentGenerics = {}
+      const usingComponentsInfo = {}
+      const usingComponents = {}
+      const finalCallback = (err) => {
+        if (err) return callback(err)
+        if (ctorType === 'app') {
+          // 在 rulesRunner 运行后保存全局注册组件
+          // todo 其余地方在使用mpx.globalComponents时存在缓存问题，要规避该问题需要在所有使用mpx.globalComponents的loader中添加app resourcePath作为fileDependency，但对于缓存有效率影响巨大
+          // todo 需要考虑一种精准控制缓存的方式，仅在全局组件发生变更时才使相关使用方的缓存失效，例如按需在相关模块上动态添加request query？
+          loaderContext._module.addPresentationalDependency(new RecordGlobalComponentsDependency(usingComponents, usingComponentsInfo, context))
+        }
+        callback(null, {
+          componentPlaceholder,
+          componentGenerics,
+          usingComponentsInfo: Object.assign({}, usingComponentsInfo, mpx.globalComponentsInfo),
+          jsonContent
+        })
+      }
+      try {
+        const ret = JSON5.parse(jsonContent)
+        const rulesMeta = {}
+        const rulesRunnerOptions = {
+          mode,
+          srcMode,
+          type: 'json',
+          waterfall: true,
+          warn: emitWarning,
+          error: emitError,
+          meta: rulesMeta
+        }
+        if (ctorType !== 'app') {
+          rulesRunnerOptions.mainKey = pagesMap[resourcePath] ? 'page' : 'component'
+        }
+        const rulesRunner = getRulesRunner(rulesRunnerOptions)
+        try {
+          if (rulesRunner) rulesRunner(ret)
+        } catch (e) {
+          return finalCallback(e)
+        }
+        // 不支持全局组件的平台，runRules 时会删除 app.json 中的 usingComponents, 同时 fillGlobalComponents 方法会对 rulesMeta 赋值 usingComponents，通过 rulesMeta 来重新获取 globalComponents
+        // page | component 时 直接获取 ret.usingComponents 内容
+        Object.assign(usingComponents, ret.usingComponents || rulesMeta.usingComponents)
+
+        if (ret.componentPlaceholder) {
+          componentPlaceholder = componentPlaceholder.concat(Object.values(ret.componentPlaceholder))
+        }
+        if (ret.componentGenerics) {
+          componentGenerics = Object.assign({}, ret.componentGenerics)
+        }
+        if (usingComponents) {
+          const setUsingComponentInfo = (name, moduleId) => {
+            usingComponentsInfo[name] = { mid: moduleId }
+          }
+          async.eachOf(usingComponents, (component, name, callback) => {
+            if (ctorType === 'app') {
+              usingComponents[name] = addQuery(component, {
+                context
+              })
+            }
+            if (!isUrlRequest(component)) {
+              const moduleId = mpx.getModuleId(component, ctorType === 'app')
+              setUsingComponentInfo(name, moduleId)
+              return callback()
+            }
+            resolve(context, component, loaderContext, (err, resource) => {
+              if (err) return callback(err)
+              const { rawResourcePath } = parseRequest(resource)
+              const moduleId = mpx.getModuleId(rawResourcePath, ctorType === 'app')
+              setUsingComponentInfo(name, moduleId)
+              callback()
+            })
+          }, (err) => {
+            finalCallback(err)
+          })
+        } else {
+          finalCallback()
+        }
+      } catch (err) {
+        finalCallback(err)
+      }
+    }
+  ], callback)
+}

package/lib/web/index.js

@@ -8,6 +8,7 @@ const RecordLoaderContentDependency = require('../dependencies/RecordLoaderConte
 
 module.exports = function ({
   parts,
+  jsonContent,
   loaderContext,
   pagesMap,
   componentsMap,
@@ -19,7 +20,7 @@ module.exports = function ({
   hasScoped,
   hasComment,
   isNative,
-  usingComponents,
+  usingComponentsInfo,
   componentGenerics,
   autoScope,
   callback
@@ -27,7 +28,7 @@ module.exports = function ({
   if (ctorType === 'app' && !queryObj.isApp) {
     return async.waterfall([
       (callback) => {
-        processJSON(parts.json, {
+        processJSON(jsonContent, {
           loaderContext,
           ctorType,
           pagesMap,
@@ -68,7 +69,7 @@ module.exports = function ({
             srcMode,
             moduleId,
             ctorType,
-            usingComponents,
+            usingComponentsInfo,
             componentGenerics
           }, callback)
         },
@@ -80,7 +81,7 @@ module.exports = function ({
           }, callback)
         },
         (callback) => {
-          processJSON(parts.json, {
+          processJSON(jsonContent, {
             loaderContext,
             ctorType,
             pagesMap,

package/lib/web/processJSON.js

@@ -12,9 +12,8 @@ const createJSONHelper = require('../json-compiler/helper')
 const getRulesRunner = require('../platform/index')
 const { RESOLVE_IGNORED_ERR } = require('../utils/const')
 const RecordResourceMapDependency = require('../dependencies/RecordResourceMapDependency')
-const RecordGlobalComponentsDependency = require('../dependencies/RecordGlobalComponentsDependency')
 
-module.exports = function (json, {
+module.exports = function (jsonContent, {
   loaderContext,
   ctorType,
   pagesMap,
@@ -82,12 +81,11 @@ module.exports = function (json, {
 
   const isApp = ctorType === 'app'
 
-  if (!json) {
+  if (!jsonContent) {
     return callback()
   }
-  // 由于json需要提前读取在template处理中使用，src的场景已经在loader中处理了，此处无需考虑json.src的场景
   try {
-    jsonObj = JSON5.parse(json.content)
+    jsonObj = JSON5.parse(jsonContent)
     // 处理runner
     const rulesRunnerOptions = {
       mode,
@@ -97,8 +95,8 @@ module.exports = function (json, {
       warn: emitWarning,
       error: emitError,
       data: {
-        // polyfill global usingComponents & record globalComponents
-        globalComponents: mpx.usingComponents
+        // polyfill global usingComponents
+        globalComponents: mpx.globalComponents
       }
     }
 
@@ -111,12 +109,6 @@ module.exports = function (json, {
     if (rulesRunner) {
       rulesRunner(jsonObj)
     }
-    if (isApp) {
-      // 收集全局组件
-      Object.assign(mpx.usingComponents, jsonObj.usingComponents)
-      // 在 rulesRunner 运行后保存全局注册组件
-      loaderContext._module.addPresentationalDependency(new RecordGlobalComponentsDependency(mpx.usingComponents, loaderContext.context))
-    }
   } catch (e) {
     return callback(e)
   }