@mpxjs/webpack-plugin 2.8.40 → 2.8.42

package/lib/dependencies/ResolveDependency.js

@@ -1,6 +1,7 @@
 const NullDependency = require('webpack/lib/dependencies/NullDependency')
 const parseRequest = require('../utils/parse-request')
 const makeSerializable = require('webpack/lib/util/makeSerializable')
+const { matchCondition } = require('../utils/match-condition')
 
 class ResolveDependency extends NullDependency {
   constructor (resource, packageName, issuerResource, range) {
@@ -22,28 +23,29 @@ class ResolveDependency extends NullDependency {
   }
 
   getResolved () {
-    const { resource, packageName, compilation } = this
+    const { resource, packageName, compilation, issuerResource } = this
     if (!compilation) return ''
     const mpx = compilation.__mpx__
     if (!mpx) return ''
-    const { pagesMap, componentsMap, staticResourcesMap } = mpx
+    const { pagesMap, componentsMap, staticResourcesMap, partialCompile } = mpx
     const { resourcePath } = parseRequest(resource)
     const currentComponentsMap = componentsMap[packageName]
     const mainComponentsMap = componentsMap.main
     const currentStaticResourcesMap = staticResourcesMap[packageName]
     const mainStaticResourcesMap = staticResourcesMap.main
-    return pagesMap[resourcePath] || currentComponentsMap[resourcePath] || mainComponentsMap[resourcePath] || currentStaticResourcesMap[resourcePath] || mainStaticResourcesMap[resourcePath] || ''
+    const resolveResult = pagesMap[resourcePath] || currentComponentsMap[resourcePath] || mainComponentsMap[resourcePath] || currentStaticResourcesMap[resourcePath] || mainStaticResourcesMap[resourcePath] || ''
+    if (!resolveResult) {
+      if (!partialCompile || matchCondition(resourcePath, partialCompile)) {
+        compilation.errors.push(new Error(`Path ${resource} is not a page/component/static resource, which is resolved from ${issuerResource}!`))
+      }
+    }
+    return resolveResult
   }
 
   // resolved可能会动态变更，需用此更新hash
   updateHash (hash, context) {
     this.resolved = this.getResolved()
-    const { resource, issuerResource, compilation } = this
-    if (this.resolved) {
-      hash.update(this.resolved)
-    } else {
-      compilation.errors.push(new Error(`Path ${resource} is not a page/component/static resource, which is resolved from ${issuerResource}!`))
-    }
+    hash.update(this.resolved)
     super.updateHash(hash, context)
   }
 

package/lib/index.js

@@ -38,7 +38,6 @@ const FlagPluginDependency = require('./dependencies/FlagPluginDependency')
 const RemoveEntryDependency = require('./dependencies/RemoveEntryDependency')
 const RecordVueContentDependency = require('./dependencies/RecordVueContentDependency')
 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')
@@ -55,6 +54,7 @@ const jsonThemeCompilerPath = normalize.lib('json-compiler/theme')
 const jsonPluginCompilerPath = normalize.lib('json-compiler/plugin')
 const extractorPath = normalize.lib('extractor')
 const async = require('async')
+const { parseQuery } = require('loader-utils')
 const stringifyLoadersAndResource = require('./utils/stringify-loaders-resource')
 const emitFile = require('./utils/emit-file')
 const { MPX_PROCESSED_FLAG, MPX_DISABLE_EXTRACTOR_CACHE } = require('./utils/const')
@@ -381,7 +381,33 @@ class MpxWebpackPlugin {
     let mpx
 
     if (this.options.partialCompile) {
-      new PartialCompilePlugin(this.options.partialCompile).apply(compiler)
+      function isResolvingPage (obj) {
+        // valid query should start with '?'
+        const query = parseQuery(obj.query || '?')
+        return query.isPage && !query.type
+      }
+      // new PartialCompilePlugin(this.options.partialCompile).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 (obj.path.startsWith(require.resolve('./json-compiler/default-page.mpx'))) {
+                return callback(null, obj)
+              }
+              if (isResolvingPage(obj) && !matchCondition(obj.path, this.options.partialCompile)) {
+                const infix = obj.query ? '&' : '?'
+                obj.query += `${infix}resourcePath=${obj.path}`
+                obj.path = require.resolve('./json-compiler/default-page.mpx')
+              }
+              callback(null, obj)
+            })
+          })
+          return hook
+        }
+      })
     }
 
     const getPackageCacheGroup = packageName => {
@@ -595,6 +621,7 @@ class MpxWebpackPlugin {
           removedChunks: [],
           forceProxyEventRules: this.options.forceProxyEventRules,
           enableRequireAsync: this.options.mode === 'wx' || (this.options.mode === 'ali' && this.options.enableAliRequireAsync),
+          partialCompile: this.options.partialCompile,
           pathHash: (resourcePath) => {
             if (this.options.pathHashMode === 'relative' && this.options.projectRoot) {
               return hash(path.relative(this.options.projectRoot, resourcePath))

package/lib/json-compiler/default-page.mpx

@@ -0,0 +1,3 @@
+<template>
+  <view>局部构建兜底页面</view>
+</template>

package/lib/json-compiler/helper.js

@@ -101,7 +101,9 @@ module.exports = function createJSONHelper ({ loaderContext, emitWarning, custom
     // 增加 page 标识
     page = addQuery(page, { isPage: true })
     resolve(context, page, loaderContext, (err, resource) => {
-      if (err) return callback(err)
+      if (err) {
+        return callback(err)
+      }
       const { resourcePath, queryObj: { isFirst } } = parseRequest(resource)
       const ext = path.extname(resourcePath)
       let outputPath
@@ -124,7 +126,8 @@ module.exports = function createJSONHelper ({ loaderContext, emitWarning, custom
       const key = [resourcePath, outputPath, tarRoot].join('|')
       callback(null, entry, {
         isFirst,
-        key
+        key,
+        resource
       })
     })
   }

package/lib/json-compiler/index.js

@@ -177,14 +177,14 @@ module.exports = function (content) {
     type: 'json',
     waterfall: true,
     warn: emitWarning,
-    error: emitError
+    error: emitError,
+    data: {
+      // polyfill global usingComponents & record globalComponents
+      globalComponents: mpx.usingComponents
+    }
   }
   if (!isApp) {
     rulesRunnerOptions.mainKey = pagesMap[resourcePath] ? 'page' : 'component'
-    // polyfill global usingComponents
-    rulesRunnerOptions.data = {
-      globalComponents: mpx.usingComponents
-    }
   }
 
   const rulesRunner = getRulesRunner(rulesRunnerOptions)
@@ -193,9 +193,12 @@ module.exports = function (content) {
     rulesRunner(json)
   }
 
-  if (isApp && json.usingComponents) {
+  if (isApp) {
+    Object.assign(mpx.usingComponents, json.usingComponents)
     // 在 rulesRunner 运行后保存全局注册组件
-    this._module.addPresentationalDependency(new RecordGlobalComponentsDependency(json.usingComponents, this.context))
+    // todo 其余地方在使用mpx.usingComponents时存在缓存问题，要规避该问题需要在所有使用mpx.usingComponents的loader中添加app resourcePath作为fileDependency，但对于缓存有效率影响巨大
+    // todo 需要考虑一种精准控制缓存的方式，仅在全局组件发生变更时才使相关使用方的缓存失效，例如按需在相关模块上动态添加request query？
+    this._module.addPresentationalDependency(new RecordGlobalComponentsDependency(mpx.usingComponents, this.context))
   }
 
   const processComponents = (components, context, callback) => {
@@ -221,14 +224,20 @@ module.exports = function (content) {
     const localPages = []
     const subPackagesCfg = {}
     const pageKeySet = new Set()
-
+    const defaultPagePath = require.resolve('./default-page.mpx')
     const processPages = (pages, context, tarRoot = '', callback) => {
       if (pages) {
+        const pagesCache = []
         async.each(pages, (page, callback) => {
-          processPage(page, context, tarRoot, (err, entry, { isFirst, key } = {}) => {
+          processPage(page, context, tarRoot, (err, entry, { isFirst, key, resource } = {}) => {
             if (err) return callback(err === RESOLVE_IGNORED_ERR ? null : err)
             if (pageKeySet.has(key)) return callback()
+            if (resource.startsWith(defaultPagePath)) {
+              pagesCache.push(entry)
+              return callback()
+            }
             pageKeySet.add(key)
+
             if (tarRoot && subPackagesCfg) {
               subPackagesCfg[tarRoot].pages.push(entry)
             } else {
@@ -241,7 +250,18 @@ module.exports = function (content) {
             }
             callback()
           })
-        }, callback)
+        }, () => {
+          if (tarRoot && subPackagesCfg) {
+            if (!subPackagesCfg[tarRoot].pages.length && pagesCache[0]) {
+              subPackagesCfg[tarRoot].pages.push(pagesCache[0])
+            }
+          } else {
+            if (!localPages.length && pagesCache[0]) {
+              localPages.push(pagesCache[0])
+            }
+          }
+          callback()
+        })
       } else {
         callback()
       }

package/lib/loader.js

@@ -120,7 +120,6 @@ module.exports = function (content) {
 
       let usingComponents = [].concat(Object.keys(mpx.usingComponents))
       let componentPlaceholder = []
-
       let componentGenerics = {}
 
       if (parts.json && parts.json.content) {
@@ -134,18 +133,12 @@ module.exports = function (content) {
         }
         if (!isApp) {
           rulesRunnerOptions.mainKey = pagesMap[resourcePath] ? 'page' : 'component'
-          // polyfill global usingComponents
-          // 预读json时无需注入polyfill全局组件
-          // rulesRunnerOptions.data = {
-          //   globalComponents: mpx.usingComponents
-          // }
         }
-
+        const rulesRunner = getRulesRunner(rulesRunnerOptions)
         try {
           const ret = JSON5.parse(parts.json.content)
+          if (rulesRunner) rulesRunner(ret)
           if (ret.usingComponents) {
-            const rulesRunner = getRulesRunner(rulesRunnerOptions)
-            if (rulesRunner) rulesRunner(ret)
             usingComponents = usingComponents.concat(Object.keys(ret.usingComponents))
           }
           if (ret.componentPlaceholder) {

package/lib/native-loader.js

@@ -137,6 +137,7 @@ module.exports = function (content) {
       } catch (e) {
         return callback(e)
       }
+      let usingComponents = Object.keys(mpx.usingComponents)
       const rulesRunnerOptions = {
         mode,
         srcMode,
@@ -147,16 +148,10 @@ module.exports = function (content) {
       }
       if (!isApp) {
         rulesRunnerOptions.mainKey = pagesMap[resourcePath] ? 'page' : 'component'
-        // polyfill global usingComponents
-        // 预读json时无需注入polyfill全局组件
-        // rulesRunnerOptions.data = {
-        //   globalComponents: mpx.usingComponents
-        // }
       }
-      let usingComponents = Object.keys(mpx.usingComponents)
+      const rulesRunner = getRulesRunner(rulesRunnerOptions)
+      if (rulesRunner) rulesRunner(json)
       if (json.usingComponents) {
-        const rulesRunner = getRulesRunner(rulesRunnerOptions)
-        if (rulesRunner) rulesRunner(json)
         usingComponents = usingComponents.concat(Object.keys(json.usingComponents))
       }
       const {

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

@@ -70,6 +70,13 @@ module.exports = function getSpec ({ warn, error }) {
     return input
   }
 
+  function fillGlobalComponents (input, { globalComponents }) {
+    if (globalComponents) {
+      Object.assign(globalComponents, input.usingComponents)
+    }
+    return input
+  }
+
   // 处理 ali swan 的组件名大写字母转连字符：WordExample/wordExample -> word-example
   function componentNameCapitalToHyphen (type) {
     return function (input) {
@@ -318,6 +325,20 @@ module.exports = function getSpec ({ warn, error }) {
         tt: deletePath(),
         jd: deletePath(true)
       },
+      {
+        test: 'usingComponents',
+        ali: componentNameCapitalToHyphen('usingComponents'),
+        swan: componentNameCapitalToHyphen('usingComponents')
+      },
+      {
+        test: 'usingComponents',
+        // todo ali 2.0已支持全局组件，待移除
+        ali: fillGlobalComponents,
+        qq: fillGlobalComponents,
+        swan: fillGlobalComponents,
+        tt: fillGlobalComponents,
+        jd: fillGlobalComponents
+      },
       {
         test: 'usingComponents',
         // todo ali 2.0已支持全局组件，待移除

package/lib/platform/template/wx/component-config/hypen-tag-name.js

@@ -1,14 +1,10 @@
 const { capitalToHyphen } = require('../../../../utils/string')
 
 module.exports = function () {
-  function convertTagName (name) {
-    return capitalToHyphen(name)
-  }
-
   return {
     // tag name contains capital letters
     test: /[A-Z]/,
-    ali: convertTagName,
-    swan: convertTagName
+    ali: capitalToHyphen,
+    swan: capitalToHyphen
   }
 }

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

@@ -8,7 +8,7 @@ const checkbox = require('./checkbox')
 const coverImage = require('./cover-image')
 const coverView = require('./cover-view')
 const form = require('./form')
-const HyphenTagName = require('./hypen-tag-name')
+const hyphenTagName = require('./hypen-tag-name')
 const icon = require('./icon')
 const image = require('./image')
 const input = require('./input')
@@ -118,7 +118,7 @@ module.exports = function getComponentConfigs ({ warn, error }) {
     camera({ print }),
     livePlayer({ print }),
     livePusher({ print }),
-    HyphenTagName({ print }),
+    hyphenTagName({ print }),
     component()
   ]
 }

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

@@ -190,16 +190,16 @@ module.exports = function getSpec ({ warn, error }) {
           }
           const styleBinding = []
           el.isStyleParsed = true
-          el.attrsList.forEach((item) => {
+          // 不过滤的话每一个属性都要 parse
+          el.attrsList.filter(item => this.test.test(item.name)).forEach((item) => {
             const parsed = parseMustache(item.value)
-            if (item.name === 'style') {
-              if (parsed.hasBinding || parsed.result.indexOf('rpx') > -1) {
-                styleBinding.push(parseMustache(item.value).result)
-              } else {
-                styleBinding.push(JSON.stringify(item.value))
-              }
-            } else if (item.name === 'wx:style') {
-              styleBinding.push(parseMustache(item.value).result)
+            if (item.name === 'wx:style') {
+              styleBinding.push(parsed.result)
+            // item.name === 'style'
+            } else if (parsed.hasBinding || parsed.result.indexOf('rpx') > -1) {
+              styleBinding.push(parsed.result)
+            } else {
+              styleBinding.push(JSON.stringify(item.value))
             }
           })
           return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.8.40",
+  "version": "2.8.42",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -82,5 +82,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "46a9b88c11f1ca2f0cfbc414e668b2f618ee6806"
+  "gitHead": "a0d7f0171b8e4535f1962bdb7415fec0d25abe93"
 }

package/lib/partial-compile/index.js

@@ -1,35 +0,0 @@
-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