@mpxjs/webpack-plugin 2.7.45 → 2.7.48

package/lib/dependencies/DynamicEntryDependency.js

@@ -5,7 +5,6 @@ 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) {
@@ -61,7 +60,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 +90,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 +117,10 @@ class DynamicEntryDependency extends NullDependency {
 
   // hash会影响最终的codeGenerateResult是否走缓存，由于该dep中resultPath是动态变更的，需要将其更新到hash中，避免错误使用缓存
   updateHash (hash, context) {
-    const { resultPath, relativePath } = this
+    const { resultPath, customApply } = 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())
+    // 当存在customApply时，插入随机hash使当前module的codeGeneration cache失效，从而执行dep.apply动态获取当前module所属的chunk路径
+    if (typeof customApply === 'function') hash.update('' + (+new Date()) + Math.random())
     super.updateHash(hash, context)
   }
 
@@ -145,19 +150,14 @@ class DynamicEntryDependency extends NullDependency {
 }
 
 DynamicEntryDependency.Template = class DynamicEntryDependencyTemplate {
-  apply (dep, source, {
-    module,
-    chunkGraph
-  }) {
-    let { resultPath, range, key, outputPath, relativePath, publicPath } = dep
-    if (outputPath === 'custom-tab-bar/index') {
-      // replace with true for custom-tab-bar
-      source.replace(range[0], range[1] - 1, 'true')
-    } else if (resultPath) {
-      if (relativePath === MPX_CURRENT_CHUNK) {
-        relativePath = publicPath + path.dirname(chunkGraph.getModuleChunks(module)[0].name)
-        resultPath = toPosix(path.relative(relativePath, resultPath))
-      }
+  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))
     } else {
       const replaceRange = `mpx_replace_path_${key}`

package/lib/helpers.js

@@ -16,6 +16,8 @@ module.exports = function createHelpers (loaderContext) {
   const rawRequest = loaderUtils.getRemainingRequest(loaderContext)
   const { resourcePath, queryObj } = parseRequest(loaderContext.resource)
 
+  const { mode, env } = loaderContext.getMpx() || {}
+
   function getRequire (type, part, extraOptions, index) {
     return 'require(' + getRequestString(type, part, extraOptions, index) + ')'
   }
@@ -66,7 +68,7 @@ module.exports = function createHelpers (loaderContext) {
       return loaderUtils.stringifyRequest(loaderContext, addQuery(src, options, true))
     } else {
       const fakeRequest = getFakeRequest(type, part)
-      const request = `${selectorPath}!${addQuery(rawRequest, options, true)}`
+      const request = `${selectorPath}?mode=${mode}&env=${env}!${addQuery(rawRequest, options, true)}`
       return loaderUtils.stringifyRequest(loaderContext, `${fakeRequest}!=!${request}`)
     }
   }

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
           },
@@ -941,7 +946,7 @@ class MpxWebpackPlugin {
         }
       })
 
-      normalModuleFactory.hooks.parser.for('javascript/auto').tap('MpxWebpackPlugin', (parser) => {
+      const normalModuleFactoryParserCallback = (parser) => {
         parser.hooks.call.for('__mpx_resolve_path__').tap('MpxWebpackPlugin', (expr) => {
           if (expr.arguments[0]) {
             const resource = expr.arguments[0].value
@@ -957,7 +962,15 @@ 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)
+          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
         })
@@ -973,7 +986,21 @@ 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)
+                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)
+                  }
+                }
                 parser.state.current.addPresentationalDependency(dep)
                 // 包含require.async的模块不能被concatenate，避免DynamicEntryDependency中无法获取模块chunk以计算相对路径
                 parser.state.module.buildInfo.moduleConcatenationBailout = 'require async'
@@ -1152,7 +1179,10 @@ class MpxWebpackPlugin {
           parser.hooks.callMemberChain.for('mpx').tap('MpxWebpackPlugin', injectSrcModeForTransApi)
           parser.hooks.callMemberChain.for('wx').tap('MpxWebpackPlugin', injectSrcModeForTransApi)
         }
-      })
+      }
+      normalModuleFactory.hooks.parser.for('javascript/auto').tap('MpxWebpackPlugin', normalModuleFactoryParserCallback)
+      normalModuleFactory.hooks.parser.for('javascript/dynamic').tap('MpxWebpackPlugin', normalModuleFactoryParserCallback)
+      normalModuleFactory.hooks.parser.for('javascript/esm').tap('MpxWebpackPlugin', normalModuleFactoryParserCallback)
 
       // 为了正确生成sourceMap，将该步骤由原来的compile.hooks.emit迁移到compilation.hooks.processAssets
       compilation.hooks.processAssets.tap({

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/selector.js

@@ -3,17 +3,17 @@ const parseRequest = require('./utils/parse-request')
 
 module.exports = function (content) {
   this.cacheable()
-  // todo 移除mpx访问依赖，支持thread-loader
-  const mpx = this.getMpx()
-  if (!mpx) {
+
+  // 移除mpx访问依赖，支持 thread-loader
+  const { mode, env } = this.getOptions() || {}
+  if (!mode && !env) {
     return content
   }
+
   const { queryObj } = parseRequest(this.resource)
   const ctorType = queryObj.ctorType
   const type = queryObj.type
   const index = queryObj.index || 0
-  const mode = mpx.mode
-  const env = mpx.env
   const filePath = this.resourcePath
   const parts = parseComponent(content, {
     filePath,

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/lib/wxs/WxsPlugin.js

@@ -23,6 +23,14 @@ class WxsPlugin {
       normalModuleFactory.hooks.parser
         .for('javascript/auto')
         .tap('WxsPlugin', handler)
+
+      normalModuleFactory.hooks.parser
+        .for('javascript/dynamic')
+        .tap('WxsPlugin', handler)
+
+      normalModuleFactory.hooks.parser
+        .for('javascript/esm')
+        .tap('WxsPlugin', handler)
     })
   }
 }

package/lib/wxs/WxsTemplatePlugin.js

@@ -35,7 +35,7 @@ class CompatGetDefaultExportRuntimeModule extends HelperRuntimeModule {
       `${fn} = ${runtimeTemplate.basicFunction('module', [
         'var getter = module && module.__esModule ?',
         Template.indent([
-          `${runtimeTemplate.returningFunction('module.default')} :`,
+          `${runtimeTemplate.returningFunction('module["default"]')} :`,
           `${runtimeTemplate.returningFunction('module')};`
         ]),
         'getter.a = getter();',

package/package.json

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