@mpxjs/webpack-plugin 2.10.15 → 2.10.16-beta.11

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

@@ -6,12 +6,14 @@ const BAIDU_UNSUPPORTED_TAG_NAME_ARR = ['functional-page-navigator', 'live-pushe
 const QQ_UNSUPPORTED_TAG_NAME_ARR = ['functional-page-navigator', 'official-account', 'editor']
 // 头条小程序不支持的标签集合
 const TT_UNSUPPORTED_TAG_NAME_ARR = ['movable-view', 'cover-image', 'cover-view', 'movable-area', 'open-data', 'official-account', 'editor', 'functional-page-navigator', 'audio', 'live-pusher']
+// 快手小程序不支持的标签集合
+const KS_UNSUPPORTED_TAG_NAME_ARR = ['match-media', 'page-container', 'root-portal', 'selection', 'functional-page-navigator', 'editor', 'editor-portal', 'keyboard-accessory', 'live-player', 'live-pusher', 'voip-room', 'channel-live', 'channel-video', 'ad-custom', 'official-account', 'official-account-publisher', 'open-data', 'store-coupon', 'store-gift', 'store-home', 'store-product']
 // 京东小程序不支持的标签集合
 const JD_UNSUPPORTED_TAG_NAME_ARR = ['functional-page-navigator', 'live-pusher', 'live-player', 'rich-text', 'audio', 'video', 'camera']
 // 快应用不支持的标签集合
 const QA_UNSUPPORTED_TAG_NAME_ARR = ['movable-view', 'movable-area', 'open-data', 'official-account', 'editor', 'functional-page-navigator', 'live-player', 'live-pusher', 'ad', 'cover-image']
 // RN不支持的标签集合
-const RN_UNSUPPORTED_TAG_NAME_ARR = ['open-data', 'official-account', 'editor', 'functional-page-navigator', 'live-player', 'live-pusher', 'ad', 'slider', 'audio', 'camera', 'match-media', 'page-container', 'editor', 'keyboard-accessory', 'map']
+const RN_UNSUPPORTED_TAG_NAME_ARR = ['open-data', 'official-account', 'editor', 'functional-page-navigator', 'live-player', 'live-pusher', 'ad', 'audio', 'match-media', 'page-container', 'editor', 'keyboard-accessory', 'map']
 
 /**
  * @param {function(object): function} print
@@ -22,6 +24,7 @@ module.exports = function ({ print }) {
   const baiduUnsupportedTagError = print({ platform: 'baidu', isError: true, type: 'tag' })
   const qqUnsupportedTagError = print({ platform: 'qq', isError: true, type: 'tag' })
   const ttUnsupportedTagError = print({ platform: 'bytedance', isError: true, type: 'tag' })
+  const ksUnsupportedTagError = print({ platform: 'ks', isError: true, type: 'tag' })
   const jdUnsupportedTagError = print({ platform: 'jd', isError: true, type: 'tag' })
   const qaUnsupportedTagError = print({ platform: 'qa', isError: true, type: 'tag' })
   const iosUnsupportedTagError = print({ platform: 'ios', isError: true, type: 'tag' })
@@ -32,6 +35,7 @@ module.exports = function ({ print }) {
   const baiduUnsupportedExp = new RegExp('^(' + BAIDU_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
   const qqUnsupportedExp = new RegExp('^(' + QQ_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
   const ttUnsupportedExp = new RegExp('^(' + TT_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
+  const ksUnsupportedExp = new RegExp('^(' + KS_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
   const jdUnsupportedExp = new RegExp('^(' + JD_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
   const qaUnsupportedExp = new RegExp('^(' + QA_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
   const iosUnsupportedExp = new RegExp('^(' + RN_UNSUPPORTED_TAG_NAME_ARR.join('|') + ')$')
@@ -59,6 +63,11 @@ module.exports = function ({ print }) {
       test: ttUnsupportedExp,
       tt: ttUnsupportedTagError
     },
+    {
+      supportedModes: ['ks'],
+      test: ksUnsupportedExp,
+      ks: ksUnsupportedTagError
+    },
     {
       supportedModes: ['jd'],
       test: jdUnsupportedExp,

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

@@ -17,6 +17,8 @@ module.exports = function ({ print }) {
   const androidEventLogError = print({ platform: 'android', tag: TAG_NAME, isError: false, type: 'event' })
   const harmonyPropLog = print({ platform: 'harmony', tag: TAG_NAME, isError: false })
   const harmonyEventLogError = print({ platform: 'harmony', tag: TAG_NAME, isError: false, type: 'event' })
+  const ksPropLog = print({ platform: 'ks', tag: TAG_NAME, isError: false })
+  const ksEventLogError = print({ platform: 'ks', tag: TAG_NAME, isError: false, type: 'event' })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -74,6 +76,10 @@ module.exports = function ({ print }) {
         test: /^(duration|enable-danmu|danmu-btn|page-gesture|direction|show-progress|show-fullscreen-btn|show-center-play-btn|enable-progress-gesture|show-mute-btn|title|play-btn-position|enable-play-gesture|auto-pause-if-navigate|auto-pause-if-open-native|vslide-gesture|vslide-gesture-in-fullscreen|show-bottom-progress|ad-unit-id|poster-for-crawler|show-casting-button|picture-in-picture-mode|picture-in-picture-show-progress| picture-in-picture-init-position|enable-auto-rotation|show-snapshot-button|show-screen-lock-button|show-background-playback-button|background-poster|referrer-policy|is-live)$/,
         android: androidPropLog,
         harmony: harmonyPropLog
+      },
+      {
+        test: /^(duration|danmu-list|enable-danmu|danmu-btn|auto-pause-if-navigate|auto-pause-if-open-native|ad-unit-id|poster-for-crawler|picture-in-picture-mode|picture-in-picture-show-progress|picture-in-picture-init-position|enable-auto-rotation|show-snapshot-button|show-background-playback-button|background-poster|is-drm|is-live|provision-url|certificate-url|license-url|preferred-peak-bit-rate)$/,
+        ks: ksPropLog
       }
     ],
     event: [
@@ -117,6 +123,10 @@ module.exports = function ({ print }) {
         test: /^(progress|enterpictureinpicture|leavepictureinpicture|castinguserselect|castingstatechange|castinginterrupt)$/,
         android: androidEventLogError,
         harmony: harmonyEventLogError
+      },
+      {
+        test: /^(waiting|controlstoggle|enterpictureinpicture|leavepictureinpicture|seekcomplete|castinguserselect)$/,
+        ks: ksEventLogError
       }
     ]
   }

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

@@ -62,7 +62,7 @@ module.exports = function getSpec ({ warn, error }) {
   }
 
   const spec = {
-    supportedModes: ['ali', 'swan', 'qq', 'tt', 'web', 'qa', 'jd', 'dd', 'ios', 'android', 'harmony'],
+    supportedModes: ['ali', 'swan', 'qq', 'tt', 'ks', 'web', 'qa', 'jd', 'dd', 'ios', 'android', 'harmony'],
     // props预处理
     preProps: [],
     // props后处理
@@ -325,6 +325,13 @@ module.exports = function getSpec ({ warn, error }) {
             value
           }
         },
+        ks ({ name, value }) {
+          const dir = this.test.exec(name)[1]
+          return {
+            name: 'ks:' + dir,
+            value
+          }
+        },
         dd ({ name, value }) {
           const dir = this.test.exec(name)[1]
           return {
@@ -413,6 +420,19 @@ module.exports = function getSpec ({ warn, error }) {
             value
           }
         },
+        ks ({ name, value }, { eventRules }) {
+          const match = this.test.exec(name)
+          const prefix = match[1]
+          const eventName = match[2]
+          const modifierStr = match[3] || ''
+          let rPrefix = runRules(spec.event.prefix, prefix, { mode: 'ks' })
+          const rEventName = runRules(eventRules, eventName, { mode: 'ks' })
+          if (rEventName.includes('-')) rPrefix += ':'
+          return {
+            name: rPrefix + rEventName + modifierStr,
+            value
+          }
+        },
         dd ({ name, value }, { eventRules }) {
           const match = this.test.exec(name)
           const prefix = match[1]

package/lib/react/index.js

@@ -21,6 +21,7 @@ module.exports = function ({
   hasComment,
   isNative,
   usingComponentsInfo,
+  originalUsingComponents,
   componentGenerics,
   autoScope,
   callback
@@ -53,6 +54,7 @@ module.exports = function ({
             moduleId,
             ctorType,
             usingComponentsInfo,
+            originalUsingComponents,
             componentGenerics
           }, callback)
         },

package/lib/react/processJSON.js

@@ -12,11 +12,8 @@ const { transSubpackage } = require('../utils/trans-async-sub-rules')
 const createJSONHelper = require('../json-compiler/helper')
 const getRulesRunner = require('../platform/index')
 const { RESOLVE_IGNORED_ERR } = require('../utils/const')
-const normalize = require('../utils/normalize')
 const RecordResourceMapDependency = require('../dependencies/RecordResourceMapDependency')
 const RecordPageConfigsMapDependency = require('../dependencies/RecordPageConfigsMapDependency')
-const mpxViewPath = normalize.lib('runtime/components/react/dist/mpx-view.jsx')
-const mpxTextPath = normalize.lib('runtime/components/react/dist/mpx-text.jsx')
 
 module.exports = function (jsonContent, {
   loaderContext,
@@ -42,23 +39,38 @@ module.exports = function (jsonContent, {
 
   const emitWarning = (msg) => {
     loaderContext.emitWarning(
-      new Error('[json processor][' + loaderContext.resource + ']: ' + msg)
+      new Error('[Mpx json warning][' + loaderContext.resource + ']: ' + msg)
     )
   }
 
   const emitError = (msg) => {
     loaderContext.emitError(
-      new Error('[json compiler][' + loaderContext.resource + ']: ' + msg)
+      new Error('[Mpx json error][' + loaderContext.resource + ']: ' + msg)
     )
   }
 
   const stringifyRequest = r => loaderUtils.stringifyRequest(loaderContext, r)
 
+  function fillInComponentsMap (name, entry, tarRoot) {
+    const { resource, outputPath } = entry
+    const { resourcePath } = parseRequest(resource)
+    componentsMap[resourcePath] = outputPath
+    loaderContext._module && loaderContext._module.addPresentationalDependency(new RecordResourceMapDependency(resourcePath, 'component', outputPath))
+    localComponentsMap[name] = {
+      resource: addQuery(resource, {
+        isComponent: true,
+        outputPath
+      }),
+      async: tarRoot
+    }
+  }
+
   const {
     isUrlRequest,
     urlToRequest,
     processPage,
-    processComponent
+    processComponent,
+    processPlaceholder
   } = createJSONHelper({
     loaderContext,
     emitWarning,
@@ -137,45 +149,6 @@ module.exports = function (jsonContent, {
     isShow: true
   }
 
-  const fillInComponentPlaceholder = (name, placeholder, placeholderEntry) => {
-    const componentPlaceholder = jsonObj.componentPlaceholder || {}
-    if (componentPlaceholder[name]) return
-    componentPlaceholder[name] = placeholder
-    jsonObj.componentPlaceholder = componentPlaceholder
-    if (placeholderEntry && !jsonObj.usingComponents[placeholder]) jsonObj.usingComponents[placeholder] = placeholderEntry
-  }
-
-  const fillInComponentsMap = (name, entry, tarRoot) => {
-    const { resource, outputPath } = entry
-    const { resourcePath } = parseRequest(resource)
-    tarRoot = transSubpackage(mpx.transSubpackageRules, tarRoot)
-    componentsMap[resourcePath] = outputPath
-    loaderContext._module && loaderContext._module.addPresentationalDependency(new RecordResourceMapDependency(resourcePath, 'component', outputPath))
-    localComponentsMap[name] = {
-      resource: addQuery(resource, {
-        isComponent: true,
-        outputPath
-      }),
-      async: tarRoot
-    }
-  }
-
-  const normalizePlaceholder = (placeholder) => {
-    if (typeof placeholder === 'string') {
-      const placeholderMap = mode === 'ali'
-        ? {
-          view: { name: 'mpx-view', resource: mpxViewPath },
-          text: { name: 'mpx-text', resource: mpxTextPath }
-        }
-        : {}
-      placeholder = placeholderMap[placeholder] || { name: placeholder }
-    }
-    if (!placeholder.name) {
-      emitError('The asyncSubpackageRules configuration format of @mpxjs/webpack-plugin a is incorrect')
-    }
-    return placeholder
-  }
-
   const processTabBar = (tabBar, callback) => {
     if (tabBar) {
       tabBar = Object.assign({}, defaultTabbar, tabBar)
@@ -345,38 +318,34 @@ module.exports = function (jsonContent, {
 
   const processComponents = (components, context, callback) => {
     if (components) {
+      const asyncComponents = []
+      const resolveResourcePathMap = new Map()
       async.eachOf(components, (component, name, callback) => {
-        processComponent(component, context, {}, (err, entry = {}, { tarRoot, placeholder } = {}) => {
+        processComponent(component, context, {}, (err, entry = {}, { tarRoot, placeholder, resourcePath } = {}) => {
           if (err) return callback(err === RESOLVE_IGNORED_ERR ? null : err)
-          fillInComponentsMap(name, entry, tarRoot)
           const { relativePath } = entry
 
-          if (tarRoot) {
+          tarRoot = transSubpackage(mpx.transSubpackageRules, tarRoot)
+
+          resolveResourcePathMap.set(name, resourcePath)
+          if (tarRoot) asyncComponents.push({ name, tarRoot, placeholder, relativePath })
+
+          fillInComponentsMap(name, entry, tarRoot)
+          callback()
+        })
+      }, (err) => {
+        if (err) return callback(err)
+        async.each(asyncComponents, ({ name, tarRoot, placeholder, relativePath }, callback) => {
+          processPlaceholder({ jsonObj, context, name, tarRoot, placeholder, relativePath, resolveResourcePathMap }, (err, placeholder) => {
+            if (err) return callback(err)
             if (placeholder) {
-              placeholder = normalizePlaceholder(placeholder)
-              if (placeholder.resource) {
-                processComponent(placeholder.resource, projectRoot, { relativePath }, (err, entry) => {
-                  if (err) return callback(err)
-                  fillInComponentPlaceholder(name, placeholder.name, entry)
-                  fillInComponentsMap(placeholder.name, entry, '')
-                  callback()
-                })
-              } else {
-                fillInComponentPlaceholder(name, placeholder.name)
-                callback()
-              }
-            } else {
-              if (!jsonObj.componentPlaceholder || !jsonObj.componentPlaceholder[name]) {
-                const errMsg = `componentPlaceholder of "${name}" doesn't exist! \n\r`
-                emitError(errMsg)
-              }
-              callback()
+              const { name, entry } = placeholder
+              fillInComponentsMap(name, entry, '')
             }
-          } else {
             callback()
-          }
-        })
-      }, callback)
+          })
+        }, callback)
+      })
     } else {
       callback()
     }
@@ -394,7 +363,6 @@ module.exports = function (jsonContent, {
       callback()
     }
   }
-
   async.parallel([
     (callback) => {
       // 添加首页标识

package/lib/react/processStyles.js

@@ -15,12 +15,12 @@ module.exports = function (styles, {
   if (styles.length) {
     const warn = (msg) => {
       loaderContext.emitWarning(
-        new Error('[style compiler][' + loaderContext.resource + ']: ' + msg)
+        new Error('[Mpx style warning][' + loaderContext.resource + ']: ' + msg)
       )
     }
     const error = (msg) => {
       loaderContext.emitError(
-        new Error('[style compiler][' + loaderContext.resource + ']: ' + msg)
+        new Error('[Mpx style error][' + loaderContext.resource + ']: ' + msg)
       )
     }
     const { mode, srcMode } = loaderContext.getMpx()
@@ -52,6 +52,7 @@ module.exports = function (styles, {
           filename: loaderContext.resourcePath,
           mode,
           srcMode,
+          ctorType,
           warn,
           error
         })

package/lib/react/processTemplate.js

@@ -17,6 +17,7 @@ module.exports = function (template, {
   moduleId,
   ctorType,
   usingComponentsInfo,
+  originalUsingComponents,
   componentGenerics
 }, callback) {
   const mpx = loaderContext.getMpx()
@@ -46,28 +47,29 @@ module.exports = function (template, {
   if (template) {
     // 由于远端src template资源引用的相对路径可能发生变化，暂时不支持。
     if (template.src) {
-      return callback(new Error('[mpx loader][' + loaderContext.resource + ']: ' + 'template content must be inline in .mpx files!'))
+      return callback(new Error('[Mpx template error][' + loaderContext.resource + ']: ' + 'template content must be inline in .mpx files!'))
     }
     if (template.lang) {
-      return callback(new Error('[mpx loader][' + loaderContext.resource + ']: ' + 'template lang is not supported in trans react native mode temporarily, we will support it in the future!'))
+      return callback(new Error('[Mpx template error][' + loaderContext.resource + ']: ' + 'template lang is not supported in trans react native mode temporarily, we will support it in the future!'))
     }
 
     if (template.content) {
       const templateSrcMode = template.mode || srcMode
       const warn = (msg) => {
         loaderContext.emitWarning(
-          new Error('[template compiler][' + loaderContext.resource + ']: ' + msg)
+          new Error('[Mpx template warning][' + loaderContext.resource + ']: ' + msg)
         )
       }
       const error = (msg) => {
         loaderContext.emitError(
-          new Error('[template compiler][' + loaderContext.resource + ']: ' + msg)
+          new Error('[mpx template error][' + loaderContext.resource + ']: ' + msg)
         )
       }
       const { root, meta } = templateCompiler.parse(template.content, {
         warn,
         error,
         usingComponentsInfo, // processTemplate中无其他地方使用，直接透传 string 类型
+        originalUsingComponents,
         hasComment,
         isNative,
         ctorType,
@@ -113,7 +115,7 @@ module.exports = function (template, {
         output += `var ${module} = require(${loaderUtils.stringifyRequest(this, src)});\n`
       }
 
-      const rawCode = genNode(root)
+      const rawCode = genNode(root, true)
       if (rawCode) {
         try {
           const ignoreMap = Object.assign({
@@ -130,7 +132,7 @@ module.exports = function (template, {
   return ${bindResult.code}
 };\n`
         } catch (e) {
-          error(`Invalid render function generated by the template, please check!
+          error(`[Mpx template error]: Invalid render function generated by the template, please check!
 Error code:
 ${rawCode}
 Error Detail:

package/lib/react/script-helper.js

@@ -4,16 +4,11 @@ const parseRequest = require('../utils/parse-request')
 const shallowStringify = require('../utils/shallow-stringify')
 const normalize = require('../utils/normalize')
 const addQuery = require('../utils/add-query')
-const { isBuildInReactTag } = require('../utils/dom-tag-config')
 
 function stringifyRequest (loaderContext, request) {
   return loaderUtils.stringifyRequest(loaderContext, request)
 }
 
-function getBuiltInComponentRequest (component) {
-  return JSON.stringify(addQuery(`@mpxjs/webpack-plugin/lib/runtime/components/react/dist/${component}`, { isComponent: true }))
-}
-
 function getAsyncChunkName (chunkName) {
   if (chunkName && typeof chunkName !== 'boolean') {
     return `/* webpackChunkName: "${chunkName}/index" */`
@@ -26,8 +21,8 @@ function getAsyncSuspense (type, moduleId, componentRequest, componentName, chun
   type: ${JSON.stringify(type)},
   moduleId: ${JSON.stringify(moduleId)},
   chunkName: ${JSON.stringify(chunkName)},
-  getFallback: ${getFallback},
-  getLoading: ${getLoading},
+  ${getFallback ? `getFallback: ${getFallback},` : ''}
+  ${getLoading ? `getLoading: ${getLoading},` : ''}
   getChildren () {
     return import(${getAsyncChunkName(chunkName)}${componentRequest}).then(function (res) {
       return getComponent(res, {displayName: ${JSON.stringify(componentName)}})
@@ -95,22 +90,17 @@ function buildComponentsMap ({ localComponentsMap, builtInComponentsMap, loaderC
         if (placeholder) {
           if (localComponentsMap[placeholder]) {
             const placeholderCfg = localComponentsMap[placeholder]
-            const placeholderRequest = stringifyRequest(loaderContext, placeholderCfg.resource)
             if (placeholderCfg.async) {
               loaderContext.emitWarning(
                 new Error(`[json processor][${loaderContext.resource}]: componentPlaceholder ${placeholder} should not be a async component, please check!`)
               )
             }
+            const placeholderRequest = stringifyRequest(loaderContext, placeholderCfg.resource)
             getFallback = getComponentGetter(getComponent(placeholderRequest, placeholder))
           } else {
-            const tag = `mpx-${placeholder}`
-            if (isBuildInReactTag(tag)) {
-              getFallback = getComponentGetter(getBuiltInComponent(getBuiltInComponentRequest(tag)))
-            } else {
-              loaderContext.emitError(
-                new Error(`[json processor][${loaderContext.resource}]: componentPlaceholder ${placeholder} is not built-in component, please check!`)
-              )
-            }
+            loaderContext.emitError(
+              new Error(`[json processor][${loaderContext.resource}]: componentPlaceholder ${placeholder} is not built-in component or custom component, please check!`)
+            )
           }
         } else {
           loaderContext.emitError(

package/lib/react/style-helper.js

@@ -1,5 +1,6 @@
 const postcss = require('postcss')
 const selectorParser = require('postcss-selector-parser')
+const { MPX_TAG_PAGE_SELECTOR } = require('../utils/const')
 const getRulesRunner = require('../platform/index')
 const dash2hump = require('../utils/hump-dash').dash2hump
 const unitRegExp = /^\s*(-?\d+(?:\.\d+)?)(rpx|vw|vh)\s*$/
@@ -7,8 +8,8 @@ const numberRegExp = /^\s*(-?\d+(\.\d+)?)(px)?\s*$/
 const hairlineRegExp = /^\s*hairlineWidth\s*$/
 const varRegExp = /^--/
 const cssPrefixExp = /^-(webkit|moz|ms|o)-/
-function getClassMap ({ content, filename, mode, srcMode, warn, error }) {
-  const classMap = {}
+function getClassMap ({ content, filename, mode, srcMode, ctorType, warn, error }) {
+  const classMap = ctorType === 'page' ? { [MPX_TAG_PAGE_SELECTOR]: { flex: 1 } } : {}
 
   const root = postcss.parse(content, {
     from: filename
@@ -36,6 +37,13 @@ function getClassMap ({ content, filename, mode, srcMode, warn, error }) {
     error
   })
 
+  // 目前所有 AtRule 只支持 @media，其他全部给出错误提示
+  root.walkAtRules(rule => {
+    if (rule.name !== 'media') {
+      warn(`Only @media rule is supported in react native mode temporarily, but got @${rule.name}`)
+    }
+  })
+
   root.walkRules(rule => {
     const classMapValue = {}
     rule.walkDecls(({ prop, value }) => {

package/lib/resolver/AddEnvPlugin.js

@@ -16,6 +16,8 @@ module.exports = class AddEnvPlugin {
   apply (resolver) {
     const target = resolver.ensureHook(this.target)
     const env = this.env
+    const envPattern = new RegExp(`\\.${env}(\\.|$)`)
+
     resolver.getHook(this.source).tapAsync('AddEnvPlugin', (request, resolveContext, callback) => {
       if (request.env) {
         return callback()
@@ -32,11 +34,22 @@ module.exports = class AddEnvPlugin {
       }
       // 当前资源没有后缀名或者路径不符合fileConditionRules规则时，直接返回
       if (!extname || !matchCondition(resourcePath, this.fileConditionRules)) return callback()
+
       const queryObj = parseQuery(request.query || '?')
       queryObj.infix = `${queryObj.infix || ''}.${env}`
+
+      const resourceBasename = path.basename(resourcePath)
+      // 如果 infix 与 resourcePath 无法匹配，则认为未命中env
+      if (envPattern.test(resourceBasename) && resourceBasename.includes(queryObj.infix)) {
+        request.query = stringifyQuery(queryObj)
+        request.env = obj.env
+        return callback()
+      }
+
       obj.query = stringifyQuery(queryObj)
       obj.path = addInfix(resourcePath, env, extname)
       obj.relativePath = request.relativePath && addInfix(request.relativePath, env, extname)
+
       resolver.doResolve(target, Object.assign({}, request, obj), 'add env: ' + env, resolveContext, callback)
     })
   }

package/lib/resolver/AddModePlugin.js

@@ -17,6 +17,9 @@ module.exports = class AddModePlugin {
     const target = resolver.ensureHook(this.target)
     const { options = {}, mode } = this
     const { defaultMode, fileConditionRules, implicitMode } = options
+    const modePattern = new RegExp(`\\.${mode}(\\.|$)`)
+    const defaultModePattern = new RegExp(`\\.${defaultMode}(\\.|$)`)
+
     resolver.getHook(this.source).tapAsync('AddModePlugin', (request, resolveContext, callback) => {
       if (request.mode || request.env) {
         return callback()
@@ -33,13 +36,28 @@ module.exports = class AddModePlugin {
       }
       // 当前资源没有后缀名或者路径不符合fileConditionRules规则时，直接返回
       if (!extname || !matchCondition(resourcePath, fileConditionRules)) return callback()
+
       const queryObj = parseQuery(request.query || '?')
       const queryInfix = queryObj.infix
       if (!implicitMode) queryObj.mode = mode
       queryObj.infix = `${queryInfix || ''}.${mode}`
+
+      // 如果已经确认是mode后缀的文件，添加query与mode后直接返回
+      if (modePattern.test(path.basename(resourcePath))) {
+        request.query = stringifyQuery(queryObj)
+        request.mode = obj.mode
+        return callback()
+      } else if (defaultMode && defaultModePattern.test(path.basename(resourcePath))) {
+        queryObj.infix = `${queryInfix || ''}.${defaultMode}`
+        request.query = stringifyQuery(queryObj)
+        request.mode = obj.mode
+        return callback()
+      }
+
       obj.query = stringifyQuery(queryObj)
       obj.path = addInfix(resourcePath, mode, extname)
       obj.relativePath = request.relativePath && addInfix(request.relativePath, mode, extname)
+
       resolver.doResolve(target, Object.assign({}, request, obj), 'add mode: ' + mode, resolveContext, (err, result) => {
         if (defaultMode && !result) {
           queryObj.infix = `${queryInfix || ''}.${defaultMode}`

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

@@ -6,9 +6,14 @@ export type LabelContextValue = MutableRefObject<{
   triggerChange: (evt: NativeSyntheticEvent<TouchEvent>) => void
 }>
 
-export type KeyboardAvoidContextValue = MutableRefObject<
-  { cursorSpacing: number, ref: MutableRefObject<any> } | null
->
+export type KeyboardAvoidContextValue = MutableRefObject<{
+  cursorSpacing: number
+  ref: MutableRefObject<any>
+  adjustPosition: boolean
+  holdKeyboard?: boolean
+  keyboardHeight?: number
+  onKeyboardShow?: () => void
+} | null>
 
 export interface GroupValue {
   [key: string]: { checked: boolean; setValue: Dispatch<SetStateAction<boolean>> }
@@ -37,13 +42,13 @@ export interface IntersectionObserver {
 }
 
 export interface PortalContextValue {
-  mount: (children: React.ReactNode, key?: number | null, id?: number| null) => number| undefined
+  mount: (children: React.ReactNode, key?: number | null, id?: number | null) => number | undefined
   update: (key: number, children: React.ReactNode) => void
   unmount: (key: number) => void
 }
 
 export interface ScrollViewContextValue {
-  gestureRef: React.RefObject<any> | null,
+  gestureRef: React.RefObject<any> | null
   scrollOffset: Animated.Value
 }
 
@@ -53,7 +58,7 @@ export interface RouteContextValue {
 }
 
 export interface StickyContextValue {
-  registerStickyHeader: Function,
+  registerStickyHeader: Function
   unregisterStickyHeader: Function
 }
 
@@ -84,3 +89,5 @@ export const ScrollViewContext = createContext<ScrollViewContextValue>({ gesture
 export const PortalContext = createContext<PortalContextValue>(null as any)
 
 export const StickyContext = createContext<StickyContextValue>({ registerStickyHeader: noop, unregisterStickyHeader: noop })
+
+export const ProviderContext = createContext(null)