@mpxjs/webpack-plugin 2.8.35 → 2.9.0-beta.0

package/lib/index.js

@@ -432,9 +432,9 @@ class MpxWebpackPlugin {
           mpx.staticResourcesMap[packageRoot] = mpx.staticResourcesMap[packageRoot] || {}
           mpx.subpackageModulesMap[packageRoot] = mpx.subpackageModulesMap[packageRoot] || {}
           async.each(deps, (dep, callback) => {
-            dep.addEntry(compilation, (err, { resultPath }) => {
+            dep.addEntry(compilation, (err, result) => {
               if (err) return callback(err)
-              dep.resultPath = mpx.replacePathMap[dep.key] = resultPath
+              dep.resultPath = mpx.replacePathMap[dep.key] = result.resultPath
               callback()
             })
           }, callback)
@@ -453,7 +453,8 @@ class MpxWebpackPlugin {
       name: 'MpxWebpackPlugin',
       stage: -1000
     }, (compilation, callback) => {
-      processSubpackagesEntriesMap(compilation, () => {
+      processSubpackagesEntriesMap(compilation, (err) => {
+        if (err) return callback(err)
         const checkRegisterPack = () => {
           for (const packRoot in mpx.dynamicEntryInfo) {
             const entryMap = mpx.dynamicEntryInfo[packRoot]

package/lib/loader.js

@@ -1,7 +1,6 @@
 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')
@@ -20,6 +19,7 @@ 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,7 +85,6 @@ 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)
@@ -161,23 +160,33 @@ module.exports = function (content) {
       // 处理mode为web时输出vue格式文件
       if (mode === 'web') {
         if (ctorType === 'app' && !queryObj.isApp) {
-          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)
+          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)
+          })
         }
-
         // 通过RecordVueContentDependency和vueContentCache确保子request不再重复生成vueContent
         const cacheContent = mpx.vueContentCache.get(filePath)
         if (cacheContent) return callback(null, cacheContent)
@@ -233,13 +242,10 @@ 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,
-              localPagesMap: jsonRes.localPagesMap
+              localComponentsMap: jsonRes.localComponentsMap
             }, callback)
           }
         ], (err, scriptRes) => {
@@ -249,7 +255,6 @@ module.exports = function (content) {
           callback(null, output)
         })
       }
-
       const moduleGraph = this._compilation.moduleGraph
 
       const issuer = moduleGraph.getIssuer(this._module)

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

@@ -1,8 +1,6 @@
 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前执行
@@ -49,6 +47,7 @@ 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,5 +1,6 @@
 <script>
   import getInnerListeners, { extendEvent } from './getInnerListeners'
+  import { isBrowser } from '../../env'
 
   export default {
     name: 'mpx-image',
@@ -21,25 +22,27 @@
       }
     },
     beforeCreate () {
-      this.image = new Image()
-      this.image.onload = (e) => {
-        extendEvent(e, {
-          detail: {
-            width: this.image.width,
-            height: this.image.height
-          }
-        })
+      if (isBrowser) {
+        this.image = new Image()
+        this.image.onload = (e) => {
+          extendEvent(e, {
+            detail: {
+              width: this.image.width,
+              height: this.image.height
+            }
+          })
 
-        this.$emit('load', e)
-      }
-      this.image.onerror = (e) => {
-        this.$emit('error', e)
+          this.$emit('load', e)
+        }
+        this.image.onerror = (e) => {
+          this.$emit('error', e)
+        }
       }
     },
     watch: {
       src: {
         handler (src) {
-          if (src) this.image.src = src
+          if (src && this.image) this.image.src = src
         },
         immediate: true
       }

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

@@ -34,27 +34,32 @@
       }
     },
     render (createElement) {
-      let text = ''
       let classNames = ['mpx-text']
       let decode = false
       const slots = this.$slots.default || []
+      const newSlots = []
       slots.forEach((item) => {
         if (item.text) {
-          // item.text = encodeText(item.text)
-          text += item.text
+          switch (this.space) {
+            case 'ensp':
+            case 'emsp':
+            case 'nbsp':
+              decode = true
+              item.text = item.text.replace(/ /g, `&${this.space};`)
+              break
+          }
+          newSlots.push(createElement('span', {
+            domProps: {
+              innerHTML: item.text
+            }
+          }))
+        } else {
+          newSlots.push(item)
         }
       })
       if (this.selectable) {
         classNames.push('selectable')
       }
-      switch (this.space) {
-        case 'ensp':
-        case 'emsp':
-        case 'nbsp':
-          decode = true
-          text = text.replace(/ /g, `&${this.space};`)
-          break
-      }
       if (this.decode) {
         decode = true
       }
@@ -62,12 +67,7 @@
         class: classNames,
         on: getInnerListeners(this)
       }
-      if (decode) {
-        data.domProps = {
-          innerHTML: text
-        }
-      }
-      return createElement('span', data, slots)
+      return createElement('span', data, decode ? newSlots : slots)
     }
   }
 </script>

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

@@ -3,7 +3,7 @@
 </template>
 
 <script>
-  import getInnerListeners, { getCustomEvent } from './getInnerListeners'
+  import { getCustomEvent } from './getInnerListeners'
   import { redirectTo, navigateTo, navigateBack, reLaunch, switchTab} from '@mpxjs/api-proxy/src/web/api/index'
 
   const eventLoad = 'load'
@@ -43,7 +43,7 @@
         return domain
       }
     },
-    created () {
+    mounted () {
       setTimeout(() => {
         if (!this.Loaded) {
           const loadData = {
@@ -52,8 +52,6 @@
           this.$emit(eventError, getCustomEvent(eventError, loadData))
         }
       }, 1000)
-    },
-    mounted () {
       this.mpxIframe = this.$refs.mpxIframe
       this.mpxIframe.addEventListener('load', (event) => {
         event.currentTarget.contentWindow.postMessage(this.mainDomain, '*')