@mpxjs/webpack-plugin 2.7.14 → 2.7.17

package/lib/index.js

@@ -8,6 +8,7 @@ const ReplaceDependency = require('./dependencies/ReplaceDependency')
 const NullFactory = require('webpack/lib/NullFactory')
 const CommonJsVariableDependency = require('./dependencies/CommonJsVariableDependency')
 const CommonJsAsyncDependency = require('./dependencies/CommonJsAsyncDependency')
+const harmonySpecifierTag = require('webpack/lib/dependencies/HarmonyImportDependencyParserPlugin').harmonySpecifierTag
 const NormalModule = require('webpack/lib/NormalModule')
 const EntryPlugin = require('webpack/lib/EntryPlugin')
 const JavascriptModulesPlugin = require('webpack/lib/javascript/JavascriptModulesPlugin')
@@ -33,6 +34,7 @@ const DynamicEntryDependency = require('./dependencies/DynamicEntryDependency')
 const FlagPluginDependency = require('./dependencies/FlagPluginDependency')
 const RemoveEntryDependency = require('./dependencies/RemoveEntryDependency')
 const SplitChunksPlugin = require('webpack/lib/optimize/SplitChunksPlugin')
+const PartialCompilePlugin = require('./partial-compile/index')
 const fixRelative = require('./utils/fix-relative')
 const parseRequest = require('./utils/parse-request')
 const { matchCondition } = require('./utils/match-condition')
@@ -130,7 +132,7 @@ class MpxWebpackPlugin {
     })
     // 批量指定源码mode
     options.modeRules = options.modeRules || {}
-    // options.generateBuildMap = options.generateBuildMap || false
+    options.generateBuildMap = options.generateBuildMap || false
     options.attributes = options.attributes || []
     options.externals = (options.externals || []).map((external) => {
       return externalsMap[external] || external
@@ -159,6 +161,7 @@ class MpxWebpackPlugin {
       cssLangs: ['css', 'less', 'stylus', 'scss', 'sass']
     }, options.nativeConfig)
     options.webConfig = options.webConfig || {}
+    options.partialCompile = options.mode !== 'web' && options.partialCompile
     this.options = options
     // Hack for buildDependencies
     const rawResolveBuildDependencies = FileSystemInfo.prototype.resolveBuildDependencies
@@ -366,6 +369,10 @@ class MpxWebpackPlugin {
 
     let mpx
 
+    if (this.options.partialCompile) {
+      new PartialCompilePlugin(this.options.partialCompile).apply(compiler)
+    }
+
     const getPackageCacheGroup = packageName => {
       if (packageName === 'main') {
         return {
@@ -1117,7 +1124,7 @@ class MpxWebpackPlugin {
         }
 
         if (mpx.srcMode !== mpx.mode) {
-          parser.hooks.callMemberChain.for('imported var').tap('MpxWebpackPlugin', handler)
+          parser.hooks.callMemberChain.for(harmonySpecifierTag).tap('MpxWebpackPlugin', handler)
           parser.hooks.callMemberChain.for('mpx').tap('MpxWebpackPlugin', handler)
           parser.hooks.callMemberChain.for('wx').tap('MpxWebpackPlugin', handler)
         }
@@ -1130,22 +1137,16 @@ class MpxWebpackPlugin {
       }, () => {
         if (mpx.mode === 'web') return
 
-        // if (this.options.generateBuildMap) {
-        //   const pagesMap = compilation.__mpx__.pagesMap
-        //   const componentsPackageMap = compilation.__mpx__.componentsMap
-        //   const componentsMap = Object.keys(componentsPackageMap).map(item => componentsPackageMap[item]).reduce((pre, cur) => {
-        //     return { ...pre, ...cur }
-        //   }, {})
-        //   const outputMap = JSON.stringify({ ...pagesMap, ...componentsMap })
-        //   compilation.assets['../outputMap.json'] = {
-        //     source: () => {
-        //       return outputMap
-        //     },
-        //     size: () => {
-        //       return Buffer.byteLength(outputMap, 'utf8')
-        //     }
-        //   }
-        // }
+        if (this.options.generateBuildMap) {
+          const pagesMap = compilation.__mpx__.pagesMap
+          const componentsPackageMap = compilation.__mpx__.componentsMap
+          const componentsMap = Object.keys(componentsPackageMap).map(item => componentsPackageMap[item]).reduce((pre, cur) => {
+            return { ...pre, ...cur }
+          }, {})
+          const outputMap = JSON.stringify({ ...pagesMap, ...componentsMap })
+          const filename = this.options.generateBuildMap.filename || 'outputMap.json'
+          compilation.assets[filename] = new RawSource(outputMap)
+        }
 
         const {
           globalObject,

package/lib/json-compiler/helper.js

@@ -97,6 +97,8 @@ module.exports = function createJSONHelper ({ loaderContext, emitWarning, custom
     if (resolveMode === 'native') {
       page = urlToRequest(page)
     }
+    // 增加 page 标识
+    page = addQuery(page, { isPage: true })
     resolve(context, page, loaderContext, (err, resource) => {
       if (err) return callback(err)
       const { resourcePath, queryObj: { isFirst } } = parseRequest(resource)

package/lib/json-compiler/index.js

@@ -571,10 +571,14 @@ module.exports = function (content) {
       delete json.subPackages
       json.pages = localPages
       for (let root in subPackagesCfg) {
-        if (!json.subPackages) {
-          json.subPackages = []
+        const subPackageCfg = subPackagesCfg[root]
+        // 分包不存在 pages，输出 subPackages 字段会报错
+        if (subPackageCfg.pages.length) {
+          if (!json.subPackages) {
+            json.subPackages = []
+          }
+          json.subPackages.push(subPackageCfg)
         }
-        json.subPackages.push(subPackagesCfg[root])
       }
       const processOutput = (output) => {
         output = processDynamicEntry(output)

package/lib/loader.js

@@ -18,15 +18,23 @@ const AppEntryDependency = require('./dependencies/AppEntryDependency')
 const RecordResourceMapDependency = require('./dependencies/RecordResourceMapDependency')
 const CommonJsVariableDependency = require('./dependencies/CommonJsVariableDependency')
 const { MPX_APP_MODULE_ID } = require('./utils/const')
+const path = require('path')
 
 module.exports = function (content) {
   this.cacheable()
 
+  // 兼容处理处理ts-loader中watch-run/updateFile逻辑，直接跳过当前loader及后续的vue-loader返回内容
+  if (path.extname(this.resourcePath) === '.ts') {
+    this.loaderIndex -= 2
+    return content
+  }
+
   const mpx = this.getMpx()
   if (!mpx) {
     return content
   }
   const { resourcePath, queryObj } = parseRequest(this.resource)
+
   const packageRoot = queryObj.packageRoot || mpx.currentPackageRoot
   const packageName = packageRoot || 'main'
   const independent = queryObj.independent
@@ -298,8 +306,10 @@ module.exports = function (content) {
           // require style
           output += getRequire('styles', style, extraOptions, i) + '\n'
         })
-      } else if (ctorType === 'app' && mode === 'ali') {
-        output += getRequire('styles', {}) + '\n'
+      }
+
+      if (parts.styles.filter(style => !style.src).length === 0 && ctorType === 'app' && mode === 'ali') {
+        output += getRequire('styles', {}, {}, parts.styles.length) + '\n'
       }
 
       // json

package/lib/partial-compile/index.js

@@ -0,0 +1,35 @@
+const { matchCondition } = require('../utils/match-condition')
+const { parseQuery } = require('loader-utils')
+
+class MpxPartialCompilePlugin {
+  constructor (condition) {
+    this.condition = condition
+  }
+
+  isResolvingPage (obj) {
+    // valid query should start with '?'
+    const query = obj.query || '?'
+    return parseQuery(query).isPage
+  }
+
+  apply (compiler) {
+    compiler.resolverFactory.hooks.resolver.intercept({
+      factory: (type, hook) => {
+        hook.tap('MpxPartialCompilePlugin', (resolver) => {
+          resolver.hooks.result.tapAsync({
+            name: 'MpxPartialCompilePlugin',
+            stage: -100
+          }, (obj, resolverContext, callback) => {
+            if (this.isResolvingPage(obj) && !matchCondition(obj.path, this.condition)) {
+              obj.path = false
+            }
+            callback(null, obj)
+          })
+        })
+        return hook
+      }
+    })
+  }
+}
+
+module.exports = MpxPartialCompilePlugin

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

@@ -246,7 +246,7 @@ module.exports = function getSpec ({ warn, error }) {
         jd: deletePath()
       },
       {
-        test: 'navigateToMiniProgramAppIdList|networkTimeout|permission',
+        test: 'navigateToMiniProgramAppIdList|networkTimeout',
         ali: deletePath(),
         jd: deletePath()
       },

package/lib/platform/template/normalize-component-rules.js

@@ -4,7 +4,7 @@ const runRules = require('../run-rules')
  * @desc 针对每一个组件(属性，event，指令等)执行规则判断
  * @params cfgs [{test: 'camera', props:[], event: []}] 组件配置列表
  * @params spec ../index.js中公共的spec
-*/
+ */
 module.exports = function normalizeComponentRules (cfgs, spec) {
   return cfgs.map((cfg) => {
     const result = {}
@@ -25,9 +25,8 @@ module.exports = function normalizeComponentRules (cfgs, spec) {
           data
         }
         el.attrsList.forEach((attr) => {
-          let rAttr = runRules(spec.preAttrs, attr, options)
           const meta = {}
-          rAttr = runRules(spec.directive, rAttr, {
+          let rAttr = runRules(spec.directive, attr, {
             ...options,
             meta
           })

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

@@ -29,7 +29,7 @@
             height: this.image.height
           }
         })
-        
+
         this.$emit('load', e)
       }
       this.image.onerror = (e) => {
@@ -45,14 +45,22 @@
       }
     },
     render (createElement) {
-      if (this.mode === 'widthFix') {
+      if (this.mode === 'widthFix' || this.mode === 'heightFix') {
+        let style
+        if (this.mode === 'widthFix') {
+           style = {
+             height: 'auto'
+           }
+        } else {
+          style = {
+            width: 'auto'
+          }
+        }
         const domProps = {}
         if (this.src) domProps.src = this.src
         return createElement('img', {
           domProps,
-          style: {
-            height: 'auto'
-          },
+          style,
           class: ['mpx-image'],
           on: getInnerListeners(this, { ignoredListeners: ['load', 'error'] })
         })

package/lib/template-compiler/compiler.js

@@ -11,6 +11,7 @@ const addQuery = require('../utils/add-query')
 const transDynamicClassExpr = require('./trans-dynamic-class-expr')
 const dash2hump = require('../utils/hump-dash').dash2hump
 const { inBrowser } = require('../utils/env')
+
 /**
  * Make a map and return a function for checking if a key
  * is in that map.
@@ -738,9 +739,6 @@ function parse (template, options) {
       currentParent.children.push(element)
       element.parent = currentParent
       processElement(element, root, options, meta)
-      if (isComponentNode(element, options) && mode === 'ali' && !options.hasVirtualHost) {
-        processAliAddComponentRootView(element, options, stack, currentParent)
-      }
       tagNames.add(element.tag)
 
       if (!unary) {
@@ -748,7 +746,7 @@ function parse (template, options) {
         stack.push(element)
       } else {
         element.unary = true
-        closeElement(element, meta)
+        closeElement(element, meta, options)
       }
     },
 
@@ -763,7 +761,7 @@ function parse (template, options) {
         // pop stack
         stack.pop()
         currentParent = stack[stack.length - 1]
-        closeElement(element, meta)
+        closeElement(element, meta, options)
       }
     },
 
@@ -906,6 +904,19 @@ function modifyAttr (el, name, val) {
   }
 }
 
+function moveBaseDirective (target, from, isDelete = true) {
+  target.for = from.for
+  target.if = from.if
+  target.elseif = from.elseif
+  target.else = from.else
+  if (isDelete) {
+    delete from.for
+    delete from.if
+    delete from.elseif
+    delete from.else
+  }
+}
+
 function stringify (str) {
   return JSON.stringify(str)
 }
@@ -1802,7 +1813,7 @@ function processBuiltInComponents (el, meta) {
   }
 }
 
-function processAliAddComponentRootView (el, options, stack, currentParent) {
+function processAliAddComponentRootView (el, options) {
   const processAttrsConditions = [
     { condition: /^(on|catch)Tap$/, action: 'clone' },
     { condition: /^(on|catch)TouchStart$/, action: 'clone' },
@@ -1811,8 +1822,11 @@ function processAliAddComponentRootView (el, options, stack, currentParent) {
     { condition: /^(on|catch)TouchCancel$/, action: 'clone' },
     { condition: /^(on|catch)LongTap$/, action: 'clone' },
     { condition: /^data-/, action: 'clone' },
-    { condition: 'style', action: 'move' },
-    { condition: 'class', action: 'append', value: `${MPX_ROOT_VIEW} host-${options.moduleId}` }
+    { condition: /^style$/, action: 'move' },
+    { condition: /^slot$/, action: 'move' }
+  ]
+  const processAppendAttrsRules = [
+    { name: 'class', value: `${MPX_ROOT_VIEW} host-${options.moduleId}` }
   ]
   let newElAttrs = []
   let allAttrs = cloneAttrsList(el.attrsList)
@@ -1822,23 +1836,18 @@ function processAliAddComponentRootView (el, options, stack, currentParent) {
   }
 
   function processMove (attr) {
-    let movedAttr = getAndRemoveAttr(el, attr.name)
-    if (movedAttr.has) {
-      newElAttrs.push({
-        name: attr,
-        value: movedAttr.val
-      })
-    }
+    getAndRemoveAttr(el, attr.name)
+    newElAttrs.push(attr)
   }
 
-  function processAppend (attr, item) {
-    const getNeedAppendAttrValue = el.attrsMap[attr.name]
-    if (getNeedAppendAttrValue) {
-      item.value = getNeedAppendAttrValue + ' ' + item.value
-    }
-    newElAttrs.push({
-      name: attr.name,
-      value: item.value
+  function processAppendRules (el) {
+    processAppendAttrsRules.forEach((rule) => {
+      const getNeedAppendAttrValue = el.attrsMap[rule.name]
+      const value = getNeedAppendAttrValue ? getNeedAppendAttrValue + ' ' + rule.value : rule.value
+      newElAttrs.push({
+        name: rule.name,
+        value
+      })
     })
   }
 
@@ -1850,22 +1859,21 @@ function processAliAddComponentRootView (el, options, stack, currentParent) {
           processClone(attr)
         } else if (item.action === 'move') {
           processMove(attr)
-        } else if (item.action === 'append') {
-          processAppend(attr, item)
         }
       }
     })
   })
 
-  // create new el
+  processAppendRules(el)
   let componentWrapView = createASTElement('view', newElAttrs)
-  currentParent.children.pop()
-  currentParent.children.push(componentWrapView)
-  componentWrapView.parent = currentParent
-  componentWrapView.children.push(el)
-  el.parent = componentWrapView
+  moveBaseDirective(componentWrapView, el)
+  if (el.is && el.components) {
+    el = postProcessComponentIs(el)
+  }
 
-  el = componentWrapView
+  replaceNode(el, componentWrapView, true)
+  addChild(componentWrapView, el)
+  return componentWrapView
 }
 
 // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。
@@ -2104,7 +2112,7 @@ function processElement (el, root, options, meta) {
   processAttrs(el, options)
 }
 
-function closeElement (el, meta) {
+function closeElement (el, meta, options) {
   postProcessAtMode(el)
   if (mode === 'web') {
     postProcessWxs(el, meta)
@@ -2114,8 +2122,13 @@ function closeElement (el, meta) {
   }
   const pass = isNative || postProcessTemplate(el) || processingTemplate
   postProcessWxs(el, meta)
+
   if (!pass) {
-    el = postProcessComponentIs(el)
+    if (isComponentNode(el, options) && !options.hasVirtualHost && mode === 'ali') {
+      el = processAliAddComponentRootView(el, options)
+    } else {
+      el = postProcessComponentIs(el)
+    }
   }
   postProcessFor(el)
   postProcessIf(el)
@@ -2154,10 +2167,7 @@ function postProcessComponentIs (el) {
     let tempNode
     if (el.for || el.if || el.elseif || el.else) {
       tempNode = createASTElement('block', [])
-      tempNode.for = el.for
-      tempNode.if = el.if
-      tempNode.elseif = el.elseif
-      tempNode.else = el.else
+      moveBaseDirective(tempNode, el)
     } else {
       tempNode = getTempNode()
     }
@@ -2183,7 +2193,7 @@ function postProcessComponentIs (el) {
     if (!el.parent) {
       error$1('Dynamic component can not be the template root, considering wrapping it with <view> or <text> tag!')
     } else {
-      el = replaceNode(el, tempNode) || el
+      el = replaceNode(el, tempNode, true) || el
     }
   }
   return el

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.7.14",
+  "version": "2.7.17",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -80,5 +80,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "6490248041554fc3b6ffbe5a3acdb6f94d12331b"
+  "gitHead": "6079aab5d336ecfac4a94a2fef44aa989cdf6614"
 }