@mpxjs/webpack-plugin 2.7.46 → 2.7.49

package/lib/dependencies/DynamicEntryDependency.js

@@ -5,10 +5,9 @@ const addQuery = require('../utils/add-query')
 const toPosix = require('../utils/to-posix')
 const async = require('async')
 const parseRequest = require('../utils/parse-request')
-const { MPX_CURRENT_CHUNK } = require('../utils/const')
 
 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
@@ -17,6 +16,7 @@ class DynamicEntryDependency extends NullDependency {
     this.relativePath = relativePath
     this.context = context
     this.range = range
+    this.extraOptions = extraOptions
   }
 
   get type () {
@@ -61,7 +61,7 @@ class DynamicEntryDependency extends NullDependency {
         })
 
         let resultPath = publicPath + filename
-        if (relativePath && relativePath !== MPX_CURRENT_CHUNK) {
+        if (relativePath) {
           resultPath = toPosix(path.relative(relativePath, resultPath))
         }
 
@@ -91,10 +91,16 @@ class DynamicEntryDependency extends NullDependency {
   }
 
   mpxAction (module, compilation, callback) {
-    const mpx = compilation.__mpx__
-    const { packageRoot, context } = this
-    this.originEntryNode = mpx.getEntryNode(module)
+    const { __mpx__: mpx, moduleGraph } = compilation
+    let entryModule = module
+    while (true) {
+      const issuer = moduleGraph.getIssuer(entryModule)
+      if (issuer) entryModule = issuer
+      else break
+    }
+    this.originEntryNode = mpx.getEntryNode(entryModule)
     this.publicPath = compilation.outputOptions.publicPath || ''
+    const { packageRoot, context } = this
     if (context) this.resolver = compilation.resolverFactory.get('normal', module.resolveOptions)
     // 分包构建在需要在主包构建完成后在finishMake中处理，返回的资源路径先用key来占位，在合成extractedAssets时再进行最终替换
     if (packageRoot && mpx.currentPackageRoot !== packageRoot) {
@@ -112,10 +118,10 @@ class DynamicEntryDependency extends NullDependency {
 
   // hash会影响最终的codeGenerateResult是否走缓存，由于该dep中resultPath是动态变更的，需要将其更新到hash中，避免错误使用缓存
   updateHash (hash, context) {
-    const { resultPath, relativePath } = this
+    const { resultPath, extraOptions } = this
     if (resultPath) hash.update(resultPath)
-    // relativePath为MPX_CURRENT_CHUNK时，插入随机hash使当前module的codeGeneration cache失效，从而执行dep.apply动态获取当前module所属的chunk路径
-    if (relativePath === MPX_CURRENT_CHUNK) 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)
   }
 
@@ -128,6 +134,7 @@ class DynamicEntryDependency extends NullDependency {
     write(this.relativePath)
     write(this.context)
     write(this.range)
+    write(this.extraOptions)
     super.serialize(context)
   }
 
@@ -140,6 +147,7 @@ class DynamicEntryDependency extends NullDependency {
     this.relativePath = read()
     this.context = read()
     this.range = read()
+    this.extraOptions = read()
     super.deserialize(context)
   }
 }
@@ -149,20 +157,30 @@ DynamicEntryDependency.Template = class DynamicEntryDependencyTemplate {
     module,
     chunkGraph
   }) {
-    let { resultPath, range, key, outputPath, relativePath, publicPath } = dep
+    const { resultPath, range, key, outputPath, publicPath, extraOptions } = dep
+
+    let replaceContent = ''
+
     if (outputPath === 'custom-tab-bar/index') {
       // replace with true for custom-tab-bar
-      source.replace(range[0], range[1] - 1, 'true')
+      replaceContent = JSON.stringify(true)
     } else if (resultPath) {
-      if (relativePath === MPX_CURRENT_CHUNK) {
-        relativePath = publicPath + path.dirname(chunkGraph.getModuleChunks(module)[0].name)
-        resultPath = toPosix(path.relative(relativePath, 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)
       }
-      source.replace(range[0], range[1] - 1, 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

@@ -55,7 +55,7 @@ const extractorPath = normalize.lib('extractor')
 const async = require('async')
 const stringifyLoadersAndResource = require('./utils/stringify-loaders-resource')
 const emitFile = require('./utils/emit-file')
-const { MPX_PROCESSED_FLAG, MPX_DISABLE_EXTRACTOR_CACHE, MPX_CURRENT_CHUNK } = require('./utils/const')
+const { MPX_PROCESSED_FLAG, MPX_DISABLE_EXTRACTOR_CACHE } = require('./utils/const')
 const isEmptyObject = require('./utils/is-empty-object')
 
 const isProductionLikeMode = options => {
@@ -164,6 +164,7 @@ class MpxWebpackPlugin {
     }, options.nativeConfig)
     options.webConfig = options.webConfig || {}
     options.partialCompile = options.mode !== 'web' && options.partialCompile
+    options.retryRequireAsync = options.retryRequireAsync || false
     this.options = options
     // Hack for buildDependencies
     const rawResolveBuildDependencies = FileSystemInfo.prototype.resolveBuildDependencies
@@ -537,7 +538,6 @@ class MpxWebpackPlugin {
           assetsASTsMap: new Map(),
           usingComponents: {},
           // todo es6 map读写性能高于object，之后会逐步替换
-          vueContentCache: new Map(),
           wxsAssetsCache: new Map(),
           currentPackageRoot: '',
           wxsContentMap: {},
@@ -585,6 +585,11 @@ class MpxWebpackPlugin {
             if (!entryNode) {
               entryNode = new EntryNode(module, type)
               entryNodeModulesMap.set(module, entryNode)
+            } else if (type) {
+              if (entryNode.type && entryNode.type !== type) {
+                compilation.errors.push(`获取request为${module.request}的entryNode时类型与已有节点冲突, 当前注册的type为${type}, 已有节点的type为${entryNode.type}!`)
+              }
+              entryNode.type = type
             }
             return entryNode
           },
@@ -957,6 +962,7 @@ class MpxWebpackPlugin {
         parser.hooks.call.for('__mpx_dynamic_entry__').tap('MpxWebpackPlugin', (expr) => {
           const args = expr.arguments.map((i) => i.value)
           args.push(expr.range)
+
           const dep = new DynamicEntryDependency(...args)
           parser.state.current.addPresentationalDependency(dep)
           return true
@@ -973,7 +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, MPX_CURRENT_CHUNK, context, range)
+                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/loader.js

@@ -46,7 +46,6 @@ module.exports = function (content) {
   const globalSrcMode = mpx.srcMode
   const localSrcMode = queryObj.mode
   const srcMode = localSrcMode || globalSrcMode
-  const vueContentCache = mpx.vueContentCache
   const autoScope = matchCondition(resourcePath, mpx.autoScopeRules)
 
   let ctorType = 'app'
@@ -60,7 +59,7 @@ module.exports = function (content) {
 
   // 支持资源query传入isPage或isComponent支持页面/组件单独编译
   if (ctorType === 'app' && (queryObj.isComponent || queryObj.isPage)) {
-    const entryName = getEntryName(this) || (queryObj.isComponent ? 'noEntryComponent' : 'noEntryPage')
+    const entryName = getEntryName(this) || mpx.getOutputPath(resourcePath, queryObj.isComponent ? 'component' : 'page')
     ctorType = queryObj.isComponent ? 'component' : 'page'
     this._module.addPresentationalDependency(new RecordResourceMapDependency(resourcePath, ctorType, entryName, packageRoot))
   }
@@ -94,10 +93,6 @@ module.exports = function (content) {
       })
     },
     (callback) => {
-      // web输出模式下没有任何inject，可以通过cache直接返回，由于读取src json可能会新增模块依赖，需要在之后返回缓存内容
-      if (vueContentCache.has(filePath)) {
-        return callback(null, vueContentCache.get(filePath))
-      }
       const hasScoped = parts.styles.some(({ scoped }) => scoped) || autoScope
       const templateAttrs = parts.template && parts.template.attrs
       const hasComment = templateAttrs && templateAttrs.comments
@@ -204,7 +199,6 @@ module.exports = function (content) {
         ], (err, scriptRes) => {
           if (err) return callback(err)
           output += scriptRes.output
-          vueContentCache.set(filePath, output)
           callback(null, output)
         })
       }

package/lib/utils/const.js

@@ -5,6 +5,5 @@ module.exports = {
   RESOLVE_IGNORED_ERR: new Error('Resolve ignored!'),
   JSON_JS_EXT: '.json.js',
   MPX_ROOT_VIEW: 'mpx-root-view', // 根节点类名
-  MPX_APP_MODULE_ID: 'mpx-app-scope', // app文件moduleId
-  MPX_CURRENT_CHUNK: 'mpx_current_chunk'
+  MPX_APP_MODULE_ID: 'mpx-app-scope' // app文件moduleId
 }

package/lib/web/processScript.js

@@ -2,6 +2,7 @@ const genComponentTag = require('../utils/gen-component-tag')
 const loaderUtils = require('loader-utils')
 const addQuery = require('../utils/add-query')
 const normalize = require('../utils/normalize')
+const parseRequest = require('../utils/parse-request')
 const optionProcessorPath = normalize.lib('runtime/optionProcessor')
 const tabBarContainerPath = normalize.lib('runtime/components/web/mpx-tab-bar-container.vue')
 const tabBarPath = normalize.lib('runtime/components/web/mpx-tab-bar.vue')
@@ -49,6 +50,7 @@ module.exports = function (script, {
     projectRoot
   } = mpx
 
+  const { queryObj } = parseRequest(loaderContext.resource)
   const tabBar = jsonConfig.tabBar
 
   const emitWarning = (msg) => {
@@ -219,7 +221,8 @@ module.exports = function (script, {
       // 为了正确获取currentSrcMode便于运行时进行转换，对于src引入的组件script采用require方式引入(由于webpack会将import的执行顺序上升至最顶)，这意味着对于src引入脚本中的named export将不会生效，不过鉴于mpx和小程序中本身也没有在组件script中声明export的用法，所以应该没有影响
       content += '\n\n\n/** Source start **/\n'
       content += script.src
-        ? `require(${stringifyRequest(script.src)})\n`
+        // 继承单文件组件query避免多个单文件模块实例引用一个src模块，因模块缓存导致createComponent不执行的问题
+        ? `require(${stringifyRequest(addQuery(script.src, queryObj))})\n`
         : script.content
       content += '\n/** Source end **/\n\n\n'
       // createApp/Page/Component执行完成后立刻获取当前的option并暂存

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.7.46",
+  "version": "2.7.49",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -80,5 +80,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "5c8b46722d862bba145badd164c4675a43a577c3"
+  "gitHead": "d24eb21aeb7b11087d5aaaffb1047e7344bfe9cf"
 }