@mpxjs/webpack-plugin 2.7.48 → 2.7.50-alpha.1

package/lib/dependencies/DynamicEntryDependency.js

@@ -7,7 +7,7 @@ const async = require('async')
 const parseRequest = require('../utils/parse-request')
 
 class DynamicEntryDependency extends NullDependency {
-  constructor (request, entryType, outputPath = '', packageRoot = '', relativePath = '', context = '', range) {
+  constructor (request, entryType, outputPath = '', packageRoot = '', relativePath = '', context = '', range, extraOptions = {}) {
     super()
     this.request = request
     this.entryType = entryType
@@ -16,6 +16,7 @@ class DynamicEntryDependency extends NullDependency {
     this.relativePath = relativePath
     this.context = context
     this.range = range
+    this.extraOptions = extraOptions
   }
 
   get type () {
@@ -117,10 +118,10 @@ class DynamicEntryDependency extends NullDependency {
 
   // hash会影响最终的codeGenerateResult是否走缓存，由于该dep中resultPath是动态变更的，需要将其更新到hash中，避免错误使用缓存
   updateHash (hash, context) {
-    const { resultPath, customApply } = this
+    const { resultPath, extraOptions } = this
     if (resultPath) hash.update(resultPath)
-    // 当存在customApply时，插入随机hash使当前module的codeGeneration cache失效，从而执行dep.apply动态获取当前module所属的chunk路径
-    if (typeof customApply === 'function') hash.update('' + (+new Date()) + Math.random())
+    // 当处理require.async时，插入随机hash使当前module的codeGeneration cache失效，从而执行dep.apply动态获取当前module所属的chunk路径
+    if (extraOptions.isRequireAsync) hash.update('' + (+new Date()) + Math.random())
     super.updateHash(hash, context)
   }
 
@@ -133,6 +134,7 @@ class DynamicEntryDependency extends NullDependency {
     write(this.relativePath)
     write(this.context)
     write(this.range)
+    write(this.extraOptions)
     super.serialize(context)
   }
 
@@ -145,24 +147,40 @@ class DynamicEntryDependency extends NullDependency {
     this.relativePath = read()
     this.context = read()
     this.range = read()
+    this.extraOptions = read()
     super.deserialize(context)
   }
 }
 
 DynamicEntryDependency.Template = class DynamicEntryDependencyTemplate {
-  apply (dep, source, options) {
-    const { resultPath, range, key, customApply } = dep
-
-    if (typeof customApply === 'function') {
-      return customApply(dep, source, options)
-    }
-
-    if (resultPath) {
-      source.replace(range[0], range[1] - 1, JSON.stringify(resultPath))
+  apply (dep, source, {
+    module,
+    chunkGraph
+  }) {
+    const { resultPath, range, key, outputPath, publicPath, extraOptions } = dep
+
+    let replaceContent = ''
+
+    if (outputPath === 'custom-tab-bar/index') {
+      // replace with true for custom-tab-bar
+      replaceContent = JSON.stringify(true)
+    } else if (resultPath) {
+      if (extraOptions.isRequireAsync) {
+        const relativePath = toPosix(path.relative(publicPath + path.dirname(chunkGraph.getModuleChunks(module)[0].name), resultPath))
+        replaceContent = JSON.stringify(relativePath)
+        if (extraOptions.retryRequireAsync) {
+          replaceContent += `).catch(function (e) {
+  return require.async(${JSON.stringify(relativePath)});
+}`
+        }
+      } else {
+        replaceContent = JSON.stringify(resultPath)
+      }
     } else {
-      const replaceRange = `mpx_replace_path_${key}`
-      source.replace(range[0], range[1] - 1, JSON.stringify(replaceRange))
+      replaceContent = JSON.stringify(`mpx_replace_path_${key}`)
     }
+
+    if (replaceContent) source.replace(range[0], range[1] - 1, replaceContent)
   }
 }
 

package/lib/index.js

@@ -964,13 +964,6 @@ class MpxWebpackPlugin {
           args.push(expr.range)
 
           const dep = new DynamicEntryDependency(...args)
-          if (args[2] === 'custom-tab-bar/index') {
-            // replace with true for custom-tab-bar
-            dep.customApply = (dep, source) => {
-              const { range } = dep
-              source.replace(range[0], range[1] - 1, 'true')
-            }
-          }
           parser.state.current.addPresentationalDependency(dep)
           return true
         })
@@ -986,21 +979,11 @@ class MpxWebpackPlugin {
               request = addQuery(request, {}, false, ['root'])
               // 目前仅wx支持require.async，其余平台使用CommonJsAsyncDependency进行模拟抹平
               if (mpx.mode === 'wx') {
-                const dep = new DynamicEntryDependency(request, 'export', '', queryObj.root, '', context, range)
-                dep.customApply = (dep, source, { module, chunkGraph }) => {
-                  let { publicPath, resultPath } = dep
-                  if (resultPath) {
-                    const relativePath = publicPath + path.dirname(chunkGraph.getModuleChunks(module)[0].name)
-                    resultPath = toPosix(path.relative(relativePath, resultPath))
-                    let replaceContent = JSON.stringify(resultPath)
-                    if (this.options.retryRequireAsync) {
-                      replaceContent += `).catch(function (e) {
-  return require.async(${JSON.stringify(resultPath)});
-}`
-                    }
-                    source.replace(range[0], range[1] - 1, replaceContent)
-                  }
-                }
+                const dep = new DynamicEntryDependency(request, 'export', '', queryObj.root, '', context, range, {
+                  isRequireAsync: true,
+                  retryRequireAsync: !!this.options.retryRequireAsync
+                })
+
                 parser.state.current.addPresentationalDependency(dep)
                 // 包含require.async的模块不能被concatenate，避免DynamicEntryDependency中无法获取模块chunk以计算相对路径
                 parser.state.module.buildInfo.moduleConcatenationBailout = 'require async'

package/lib/template-compiler/compiler.js

@@ -1989,12 +1989,11 @@ function processAtMode (el) {
       return
     }
 
-    const conditionMap = {}
-
+    const conditionMap = new Map()
     modeStr.split('|').forEach(item => {
       const arr = item.split(':')
-      const key = arr[0] || mode
-      conditionMap[key] = arr.slice(1)
+      const key = arr[0] || 'noMode'
+      conditionMap.set(key, arr.slice(1))
     })
 
     const modeArr = Object.keys(conditionMap)
@@ -2002,19 +2001,30 @@ function processAtMode (el) {
     if (modeArr.every(i => isValidMode(i))) {
       const attrValue = getAndRemoveAttr(el, attrName).val
       const replacedAttrName = attrArr.join('@')
-
       const processedAttr = { name: replacedAttrName, value: attrValue }
-      if (modeArr.includes(mode) && (!conditionMap[mode].length || conditionMap[mode].includes(env))) {
-        if (!replacedAttrName) {
-          el._atModeStatus = 'match'
+
+      for (let [defineMode, defineEnvArr] of conditionMap.entries()) {
+        if (defineMode === 'noMode' || defineMode === mode) {
+          // 命中 env 规则(没有定义env 或者定义的envArr包含当前env)
+          if (!defineEnvArr.length || defineEnvArr.includes(env)) {
+            if (!replacedAttrName) {
+              // 若defineMode 为 noMode，则不论是element，还是attr，都需要经过规则转换
+              if (defineMode !== 'noMode') {
+                el._atModeStatus = 'match'
+              }
+            } else {
+              // 如果命中了指定的mode，则先存在el上，等跑完转换后再挂回去
+              el.noTransAttrs ? el.noTransAttrs.push(processedAttr) : el.noTransAttrs = [processedAttr]
+            }
+            // 完成匹配，直接退出
+            break
+          }
+        } else if (!replacedAttrName) {
+          // 没有命中当前规则，设置为 'mismatch'
+          el._atModeStatus = 'mismatch'
         } else {
-          // 如果命中了指定的mode，则先存在el上，等跑完转换后再挂回去
-          el.noTransAttrs ? el.noTransAttrs.push(processedAttr) : el.noTransAttrs = [processedAttr]
+          // 如果没命中指定的mode，则该属性删除
         }
-      } else if (!replacedAttrName) {
-        el._atModeStatus = 'mismatch'
-      } else {
-        // 如果没命中指定的mode，则该属性删除
       }
     }
   })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.7.48",
+  "version": "2.7.50-alpha.1",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -80,5 +80,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "4e8f3ea3d582b3819856345ee618d705eb5eb2e3"
+  "gitHead": "58fa63ed6dd39f6d01186697a24571c4ef14e4f0"
 }