@mpxjs/webpack-plugin 2.8.64-bridgetest → 2.8.64

package/lib/dependencies/DynamicEntryDependency.js

@@ -28,10 +28,23 @@ class DynamicEntryDependency extends NullDependency {
     return toPosix([request, entryType, outputPath, packageRoot, relativePath, context, ...range].join('|'))
   }
 
+  collectDynamicRequest (mpx) {
+    if (!this.packageRoot) return
+    const curValue = mpx.dynamicEntryInfo[this.packageRoot] = mpx.dynamicEntryInfo[this.packageRoot] || {
+      hasPage: false,
+      entries: []
+    }
+    if (this.entryType === 'page') {
+      curValue.hasPage = true
+    } else {
+      curValue.entries.push(this.request)
+    }
+  }
+
   addEntry (compilation, callback) {
     const mpx = compilation.__mpx__
     let { request, entryType, outputPath, relativePath, context, originEntryNode, publicPath, resolver } = this
-
+    this.collectDynamicRequest(mpx)
     async.waterfall([
       (callback) => {
         if (context && resolver) {
@@ -43,13 +56,12 @@ class DynamicEntryDependency extends NullDependency {
         }
       },
       (resource, callback) => {
-        const { resourcePath } = parseRequest(resource)
-
         if (!outputPath) {
+          const { resourcePath } = parseRequest(resource)
           outputPath = mpx.getOutputPath(resourcePath, entryType)
         }
 
-        const { packageName, packageRoot, outputPath: filename, alreadyOutputted } = mpx.getPackageInfo({
+        const { packageRoot, outputPath: filename, alreadyOutputted } = mpx.getPackageInfo({
           resource,
           outputPath,
           resourceType: entryType,
@@ -104,12 +116,6 @@ class DynamicEntryDependency extends NullDependency {
             .catch(err => callback(err))
 
           mpx.addEntryPromiseMap.set(key, addEntryPromise)
-          mpx.collectDynamicEntryInfo({
-            resource,
-            packageName,
-            filename,
-            entryType
-          })
         }
       }
     ], callback)

package/lib/index.js

@@ -113,6 +113,7 @@ class MpxWebpackPlugin {
   constructor (options = {}) {
     options.mode = options.mode || 'wx'
     options.env = options.env || ''
+
     options.srcMode = options.srcMode || options.mode
     if (options.mode !== options.srcMode && options.srcMode !== 'wx') {
       errors.push('MpxWebpackPlugin supports srcMode to be "wx" only temporarily!')
@@ -493,17 +494,17 @@ class MpxWebpackPlugin {
     }, (compilation, callback) => {
       processSubpackagesEntriesMap(compilation, (err) => {
         if (err) return callback(err)
-        const checkDynamicEntryInfo = () => {
-          for (const packageName in mpx.dynamicEntryInfo) {
-            const entryMap = mpx.dynamicEntryInfo[packageName]
-            if (packageName !== 'main' && !entryMap.hasPage) {
+        const checkRegisterPack = () => {
+          for (const packRoot in mpx.dynamicEntryInfo) {
+            const entryMap = mpx.dynamicEntryInfo[packRoot]
+            if (!entryMap.hasPage) {
               // 引用未注册分包的所有资源
-              const resources = entryMap.entries.map(info => info.resource).join(',')
-              compilation.errors.push(new Error(`资源${resources}通过分包异步声明为${packageName}分包, 但${packageName}分包未注册或不存在相关页面！`))
+              const strRequest = entryMap.entries.join(',')
+              compilation.errors.push(new Error(`资源${strRequest}目标是打入${packRoot}分包, 但是app.json中并未声明${packRoot}分包`))
             }
           }
         }
-        checkDynamicEntryInfo()
+        checkRegisterPack()
         callback()
       })
     })
@@ -563,8 +564,8 @@ class MpxWebpackPlugin {
     })
 
     compiler.hooks.thisCompilation.tap('MpxWebpackPlugin', (compilation, { normalModuleFactory }) => {
-      compilation.warnings.push(...warnings)
-      compilation.errors.push(...errors)
+      compilation.warnings = compilation.warnings.concat(warnings)
+      compilation.errors = compilation.errors.concat(errors)
       const moduleGraph = compilation.moduleGraph
 
       if (!compilation.__mpx__) {
@@ -593,7 +594,7 @@ class MpxWebpackPlugin {
           subpackagesEntriesMap: {},
           replacePathMap: {},
           exportModules: new Set(),
-          // 记录动态添加入口的分包信息
+          // 动态记录注册的分包与注册页面映射
           dynamicEntryInfo: {},
           // 记录entryModule与entryNode的对应关系，用于体积分析
           entryNodeModulesMap: new Map(),
@@ -637,18 +638,6 @@ class MpxWebpackPlugin {
           forceProxyEventRules: this.options.forceProxyEventRules,
           enableRequireAsync: this.options.mode === 'wx' || (this.options.mode === 'ali' && this.options.enableAliRequireAsync),
           partialCompile: this.options.partialCompile,
-          collectDynamicEntryInfo: ({ resource, packageName, filename, entryType }) => {
-            const curInfo = mpx.dynamicEntryInfo[packageName] = mpx.dynamicEntryInfo[packageName] || {
-              hasPage: false,
-              entries: []
-            }
-            if (entryType === 'page') curInfo.hasPage = true
-            curInfo.entries.push({
-              entryType,
-              resource,
-              filename
-            })
-          },
           asyncSubpackageRules: this.options.asyncSubpackageRules,
           optimizeRenderRules: this.options.optimizeRenderRules,
           pathHash: (resourcePath) => {
@@ -657,7 +646,7 @@ class MpxWebpackPlugin {
             }
             return hash(resourcePath)
           },
-          addEntry: (request, name, callback) => {
+          addEntry (request, name, callback) {
             const dep = EntryPlugin.createDependency(request, { name })
             compilation.addEntry(compiler.context, dep, { name }, callback)
             return dep
@@ -825,14 +814,10 @@ class MpxWebpackPlugin {
       const rawProcessModuleDependencies = compilation.processModuleDependencies
       compilation.processModuleDependencies = (module, callback) => {
         const presentationalDependencies = module.presentationalDependencies || []
-        const errors = []
         async.forEach(presentationalDependencies.filter((dep) => dep.mpxAction), (dep, callback) => {
-          dep.mpxAction(module, compilation, (err) => {
-            if (err) errors.push(err)
-            callback()
-          })
-        }, () => {
-          compilation.errors.push(...errors)
+          dep.mpxAction(module, compilation, callback)
+        }, (err) => {
+          if (err) compilation.errors.push(err)
           rawProcessModuleDependencies.call(compilation, module, callback)
         })
       }
@@ -918,17 +903,16 @@ class MpxWebpackPlugin {
       }
 
       // hack process https://github.com/webpack/webpack/issues/16045
-      // no need anymore
-      // const _handleModuleBuildAndDependenciesRaw = compilation._handleModuleBuildAndDependencies
-      //
-      // compilation._handleModuleBuildAndDependencies = (originModule, module, recursive, callback) => {
-      //   const rawCallback = callback
-      //   callback = (err) => {
-      //     if (err) return rawCallback(err)
-      //     return rawCallback(null, module)
-      //   }
-      //   return _handleModuleBuildAndDependenciesRaw.call(compilation, originModule, module, recursive, callback)
-      // }
+      const _handleModuleBuildAndDependenciesRaw = compilation._handleModuleBuildAndDependencies
+
+      compilation._handleModuleBuildAndDependencies = (originModule, module, recursive, callback) => {
+        const rawCallback = callback
+        callback = (err) => {
+          if (err) return rawCallback(err)
+          return rawCallback(null, module)
+        }
+        return _handleModuleBuildAndDependenciesRaw.call(compilation, originModule, module, recursive, callback)
+      }
 
       const rawEmitAsset = compilation.emitAsset
 

package/lib/loader.js

@@ -1,6 +1,7 @@
 const JSON5 = require('json5')
 const parseComponent = require('./parser')
 const createHelpers = require('./helpers')
+const loaderUtils = require('loader-utils')
 const parseRequest = require('./utils/parse-request')
 const { matchCondition } = require('./utils/match-condition')
 const addQuery = require('./utils/add-query')
@@ -19,7 +20,6 @@ const CommonJsVariableDependency = require('./dependencies/CommonJsVariableDepen
 const tsWatchRunLoaderFilter = require('./utils/ts-loader-watch-run-loader-filter')
 const { MPX_APP_MODULE_ID } = require('./utils/const')
 const path = require('path')
-const processMainScript = require('./web/processMainScript')
 const getRulesRunner = require('./platform')
 
 module.exports = function (content) {
@@ -85,6 +85,7 @@ module.exports = function (content) {
     if (appName) this._module.addPresentationalDependency(new AppEntryDependency(resourcePath, appName))
   }
   const loaderContext = this
+  const stringifyRequest = r => loaderUtils.stringifyRequest(loaderContext, r)
   const isProduction = this.minimize || process.env.NODE_ENV === 'production'
   const filePath = this.resourcePath
   const moduleId = ctorType === 'app' ? MPX_APP_MODULE_ID : 'm' + mpx.pathHash(filePath)
@@ -153,33 +154,23 @@ module.exports = function (content) {
       // 处理mode为web时输出vue格式文件
       if (mode === 'web') {
         if (ctorType === 'app' && !queryObj.isApp) {
-          return async.waterfall([
-            (callback) => {
-              processJSON(parts.json, { loaderContext, pagesMap, componentsMap }, callback)
-            },
-            (jsonRes, callback) => {
-              processMainScript(parts.script, {
-                loaderContext,
-                ctorType,
-                srcMode,
-                moduleId,
-                isProduction,
-                jsonConfig: jsonRes.jsonObj,
-                outputPath: queryObj.outputPath || '',
-                localComponentsMap: jsonRes.localComponentsMap,
-                tabBar: jsonRes.jsonObj.tabBar,
-                tabBarMap: jsonRes.tabBarMap,
-                tabBarStr: jsonRes.tabBarStr,
-                localPagesMap: jsonRes.localPagesMap,
-                resource: this.resource
-              }, callback)
-            }
-          ], (err, scriptRes) => {
-            if (err) return callback(err)
-            this.loaderIndex = -1
-            return callback(null, scriptRes.output)
-          })
+          const request = addQuery(this.resource, { isApp: true })
+          const el = mpx.webConfig.el || '#app'
+          output += `
+      import App from ${stringifyRequest(request)}
+      import Vue from 'vue'
+      new Vue({
+        el: '${el}',
+        render: function(h){
+          return h(App)
+        }
+      })\n
+      `
+          // 直接结束loader进入parse
+          this.loaderIndex = -1
+          return callback(null, output)
         }
+
         // 通过RecordVueContentDependency和vueContentCache确保子request不再重复生成vueContent
         const cacheContent = mpx.vueContentCache.get(filePath)
         if (cacheContent) return callback(null, cacheContent)
@@ -235,10 +226,13 @@ module.exports = function (content) {
               componentGenerics,
               jsonConfig: jsonRes.jsonObj,
               outputPath: queryObj.outputPath || '',
+              tabBarMap: jsonRes.tabBarMap,
+              tabBarStr: jsonRes.tabBarStr,
               builtInComponentsMap: templateRes.builtInComponentsMap,
               genericsInfo: templateRes.genericsInfo,
               wxsModuleMap: templateRes.wxsModuleMap,
-              localComponentsMap: jsonRes.localComponentsMap
+              localComponentsMap: jsonRes.localComponentsMap,
+              localPagesMap: jsonRes.localPagesMap
             }, callback)
           }
         ], (err, scriptRes) => {
@@ -248,6 +242,7 @@ module.exports = function (content) {
           callback(null, output)
         })
       }
+
       const moduleGraph = this._compilation.moduleGraph
 
       const issuer = moduleGraph.getIssuer(this._module)

package/lib/parser.js

@@ -2,6 +2,7 @@ const cache = require('lru-cache')(100)
 const hash = require('hash-sum')
 const compiler = require('./template-compiler/compiler')
 const SourceMapGenerator = require('source-map').SourceMapGenerator
+
 const splitRE = /\r?\n/g
 const emptyRE = /^(?:\/\/)?\s*$/
 

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

@@ -1,4 +1,5 @@
-const { parseMustache } = require('../../../../template-compiler/compiler')
+const templateCompiler = require('../../../../template-compiler/compiler')
+const parseMustache = templateCompiler.parseMustache
 const normalize = require('../../../../utils/normalize')
 const TAG_NAME = 'component'
 

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

@@ -3,7 +3,9 @@ const JSON5 = require('json5')
 const getComponentConfigs = require('./component-config')
 const normalizeComponentRules = require('../normalize-component-rules')
 const isValidIdentifierStr = require('../../../utils/is-valid-identifier-str')
-const { parseMustacheWithContext, stringifyWithResolveComputed } = require('../../../template-compiler/compiler')
+const templateCompiler = require('../../../template-compiler/compiler')
+const parseMustache = templateCompiler.parseMustache
+const stringifyWithResolveComputed = templateCompiler.stringifyWithResolveComputed
 const normalize = require('../../../utils/normalize')
 
 module.exports = function getSpec ({ warn, error }) {
@@ -15,10 +17,10 @@ module.exports = function getSpec ({ warn, error }) {
     postProps: [
       {
         web ({ name, value }) {
-          const parsed = parseMustacheWithContext(value)
+          const parsed = parseMustache(value)
           if (parsed.hasBinding) {
             return {
-              name: name === 'animation' ? 'v-animation' : ':' + name,
+              name: name === 'animation' ? 'v-' + name : ':' + name,
               value: parsed.result
             }
           }
@@ -32,7 +34,7 @@ module.exports = function getSpec ({ warn, error }) {
         test: 'wx:for',
         swan (obj, data) {
           const attrsMap = data.el.attrsMap
-          const parsed = parseMustacheWithContext(obj.value)
+          const parsed = parseMustache(obj.value)
           let listName = parsed.result
           const el = data.el
 
@@ -46,7 +48,7 @@ module.exports = function getSpec ({ warn, error }) {
           }
 
           if (keyName) {
-            const parsed = parseMustacheWithContext(keyName)
+            const parsed = parseMustache(keyName)
             if (parsed.hasBinding) {
               // keyStr = ` trackBy ${parsed.result.slice(1, -1)}`
             } else if (keyName === '*this') {
@@ -76,7 +78,7 @@ module.exports = function getSpec ({ warn, error }) {
           }
         },
         web ({ value }, { el }) {
-          const parsed = parseMustacheWithContext(value)
+          const parsed = parseMustache(value)
           const attrsMap = el.attrsMap
           const itemName = attrsMap['wx:for-item'] || 'item'
           const indexName = attrsMap['wx:for-index'] || 'index'
@@ -188,8 +190,9 @@ module.exports = function getSpec ({ warn, error }) {
           }
           const styleBinding = []
           el.isStyleParsed = true
+          // 不过滤的话每一个属性都要 parse
           el.attrsList.filter(item => this.test.test(item.name)).forEach((item) => {
-            const parsed = parseMustacheWithContext(item.value)
+            const parsed = parseMustache(item.value)
             styleBinding.push(parsed.result)
           })
           return {
@@ -200,12 +203,20 @@ module.exports = function getSpec ({ warn, error }) {
       },
       {
         // 样式类名绑定
-        test: /^wx:(class)$/,
-        web ({ value }) {
-          const parsed = parseMustacheWithContext(value)
+        test: /^(class|wx:class)$/,
+        web ({ value }, { el }) {
+          if (el.isClassParsed) {
+            return false
+          }
+          const classBinding = []
+          el.isClassParsed = true
+          el.attrsList.filter(item => this.test.test(item.name)).forEach((item) => {
+            const parsed = parseMustache(item.value)
+            classBinding.push(parsed.result)
+          })
           return {
             name: ':class',
-            value: parsed.result
+            value: `[${classBinding}]`
           }
         }
       },
@@ -256,7 +267,7 @@ module.exports = function getSpec ({ warn, error }) {
         },
         web ({ name, value }) {
           let dir = this.test.exec(name)[1]
-          const parsed = parseMustacheWithContext(value)
+          const parsed = parseMustache(value)
           if (dir === 'elif') {
             dir = 'else-if'
           }
@@ -356,7 +367,7 @@ module.exports = function getSpec ({ warn, error }) {
           }
         },
         web ({ name, value }, { eventRules, el, usingComponents }) {
-          if (parseMustacheWithContext(value).hasBinding) {
+          if (parseMustache(value).hasBinding) {
             error('Web environment does not support mustache binding in event props!')
             return
           }

package/lib/runtime/base.styl

@@ -48,17 +48,9 @@ span {
   white-space: pre-line;
 }
 
-html, body, #app {
-  display: block;
-  width: 100%;
-  height: 100%;
-}
-
-page {
-  display: block;
+html, body, .app {
   width: 100%;
   height: 100%;
-  background-color: #fff;
 }
 
 .pull-down-loading {

package/lib/runtime/components/web/getInnerListeners.js

@@ -1,6 +1,8 @@
 import { isEmptyObject } from '../../utils'
 import { isBrowser } from '../../env'
 
+const isTouchDevice = isBrowser ? document && ('ontouchstart' in document.documentElement) : true
+
 function processModel (listeners, context) {
   // 该函数只有wx:model的情况下才调用，而且默认e.detail.value有值
   // 该函数必须在产生merge前执行
@@ -47,7 +49,6 @@ function mergeListeners (listeners, otherListeners, options = {}) {
 function processTap (listeners, context) {
   const listenerMap = {}
   const tapEvents = ['tap', 'longpress', 'longtap']
-  const isTouchDevice = isBrowser ? document && ('ontouchstart' in document.documentElement) : true
   tapEvents.forEach((eventName) => {
     if (listeners[eventName]) {
       listenerMap[eventName] = true

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

@@ -1,6 +1,5 @@
 <script>
   import getInnerListeners, { getCustomEvent } from './getInnerListeners'
-  import { isBrowser } from '../../env'
 
   export default {
     name: 'mpx-image',
@@ -22,23 +21,21 @@
       }
     },
     beforeCreate () {
-      if (isBrowser) {
-        this.image = new Image()
-        this.image.onload = () => {
-          this.$emit('load', getCustomEvent('load', {
-            width: this.image.width,
-            height: this.image.height
-          }, this))
-        }
-        this.image.onerror = () => {
-          this.$emit('error', getCustomEvent('error', {}, this))
-        }
+      this.image = new Image()
+      this.image.onload = () => {
+        this.$emit('load', getCustomEvent('load', {
+          width: this.image.width,
+          height: this.image.height
+        }, this))
+      }
+      this.image.onerror = () => {
+        this.$emit('error', getCustomEvent('error', {}, this))
       }
     },
     watch: {
       src: {
         handler (src) {
-          if (src && this.image) this.image.src = src
+          if (src) this.image.src = src
         },
         immediate: true
       }

package/lib/runtime/components/web/mpx-movable-view.vue

@@ -178,7 +178,7 @@
             this.refresh()
           })
           const elementToObserve = document.querySelector('.mpx-movable-scroll-content')
-          this.resizeObserver.observe(elementToObserve)
+          elementToObserve && this.resizeObserver.observe(elementToObserve)
         }
       },
       refresh () {

package/lib/runtime/components/web/mpx-picker-view-column.vue

@@ -15,7 +15,13 @@
   export default {
     name: 'mpx-picker-view-column',
     props: {
-      value: Array
+      value: Array,
+      scrollOptions: {
+        type: Object,
+        default: () => {
+          return {}
+        }
+      }
     },
     data() {
       return {
@@ -64,7 +70,9 @@
               rotate: -5,
               wheelWrapperClass: 'wheel-scroll'
             },
-            probeType: 3
+            probeType: 3,
+            bindToWrapper: true,
+            ...this.scrollOptions
           })
           this.wheels[0].on('scrollStart', function () {
             if (this.pickerView) {

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

@@ -138,6 +138,12 @@
       fields: {
         type: String,
         default: 'day'
+      },
+      scrollOptions: {
+        type: Object,
+        default: () => {
+          return {}
+        }
       }
     },
     data () {
@@ -311,7 +317,9 @@
                     wheelWrapperClass: 'wheel-scroll',
                     wheelItemClass: 'wheel-item'
                   },
-                  probeType: 3
+                  probeType: 3,
+                  bindToWrapper: true,
+                  ...this.scrollOptions
                 })
                 if (this.mode === 'time' || this.mode === 'date') {
                   this.wheels[i].on('scrollStart', function (i) {

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

@@ -47,7 +47,7 @@
         default: () => {
           return {}
         }
-      },
+      }
     },
     data () {
       return {
@@ -212,7 +212,7 @@
         this.bs.scroller.hooks.on('beforeRefresh', () => {
           this.initLayerComputed()
         })
-        this.bs.on('slideWillChange', (page) => {
+        this.bs.on('slidePageChanged', (page) => {
           this.currentIndex = this.vertical ? page.pageY : page.pageX
           this.$emit('change', getCustomEvent('change', {
             current: this.currentIndex,