@mpxjs/webpack-plugin 2.6.114-alpha.8 → 2.6.115

package/lib/template-compiler/compiler.js

@@ -1,16 +1,16 @@
 const JSON5 = require('json5')
 const he = require('he')
 const config = require('../config')
-const { MPX_ROOT_VIEW, MPX_APP_MODULE_ID } = require('../utils/const')
+const { MPX_ROOT_VIEW, MPX_APP_MODULE_ID } = require('../staticConfig')
 const normalize = require('../utils/normalize')
 const isValidIdentifierStr = require('../utils/is-valid-identifier-str')
 const isEmptyObject = require('../utils/is-empty-object')
+const mpxJSON = require('../utils/mpx-json')
 const getRulesRunner = require('../platform/index')
 const addQuery = require('../utils/add-query')
 const transDynamicClassExpr = require('./trans-dynamic-class-expr')
 const dash2hump = require('../utils/hump-dash').dash2hump
 const { inBrowser } = require('../utils/env')
-const { matchCondition } = require('../utils/match-condition')
 
 /**
  * Make a map and return a function for checking if a key
@@ -130,6 +130,107 @@ function isForbiddenTag (el) {
   )
 }
 
+// mpx special comments
+// example
+/*
+{
+  'tt,swan': {
+    remove: [
+      'open-type',
+      // src mode attr
+      'wx:if'
+    ],
+    add: {
+      type: 'primary',
+      // attr name only
+      foo: null,
+    }
+  }
+}
+*/
+let curMpxComment = null
+
+function evalMpxCommentExp (exp) {
+  /* eslint-disable no-new-func */
+  const f = new Function(`return ${exp};`)
+  return f()
+}
+
+function isMpxCommentAttrs (content) {
+  return /@mpx-attrs/.test(content)
+}
+
+function normalizePlatformMpxAttrsOpts (opts) {
+  const ret = {}
+  // Array to map for removing attributes
+  ret.remove = (opts.remove || []).reduce((acc, val) => {
+    acc[val] = true
+    return acc
+  }, {})
+  // Default adding map
+  ret.add = opts.add || {}
+  return ret
+}
+
+function produceMpxCommentAttrs (content) {
+  const exp = /@mpx-attrs[^(]*?\(([\s\S]*)\)/.exec(content)[1].trim()
+  const tmpOpts = evalMpxCommentExp(exp)
+  // normalize
+  Object.keys(tmpOpts).forEach(k => {
+    Object.assign(tmpOpts[k], normalizePlatformMpxAttrsOpts(tmpOpts[k]))
+
+    if (k.indexOf(',') > -1) {
+      const modes = k.split(',')
+      modes.forEach(mode => {
+        tmpOpts[mode] = tmpOpts[k]
+      })
+      delete tmpOpts[k]
+    }
+  })
+  curMpxComment = tmpOpts
+}
+
+function modifyAttrsFromCurMpxAttrOptions (attrs, curModeMpxComment) {
+  const removeMap = curModeMpxComment.remove
+  const addMap = curModeMpxComment.add
+
+  const newAttrs = []
+  attrs.forEach(attr => {
+    if (!removeMap[attr.name]) {
+      newAttrs.push(attr)
+    }
+  })
+
+  Object.keys(addMap).forEach(name => {
+    newAttrs.push({
+      name,
+      value: addMap[name]
+    })
+  })
+
+  return newAttrs
+}
+
+function consumeMpxCommentAttrs (attrs, mode) {
+  let ret = attrs
+  if (curMpxComment) {
+    const curModeMpxComment = curMpxComment[mode]
+    if (curModeMpxComment) {
+      ret = modifyAttrsFromCurMpxAttrOptions(attrs, curModeMpxComment)
+    }
+
+    // reset
+    curMpxComment = null
+  }
+  return ret
+}
+
+function assertMpxCommentAttrsEnd () {
+  if (curMpxComment) {
+    error$1('No target for @mpx-attrs!')
+  }
+}
+
 // Browser environment sniffing
 const UA = inBrowser && window.navigator.userAgent.toLowerCase()
 const isIE = UA && /msie|trident/.test(UA)
@@ -153,9 +254,6 @@ let forScopesMap = {}
 let hasI18n = false
 let i18nInjectableComputed = []
 let env
-let platformGetTagNamespace
-let filePath
-let refId
 
 function updateForScopesMap () {
   forScopes.forEach((scope) => {
@@ -182,6 +280,9 @@ const deleteErrorInResultMap = (node) => {
   rulesResultMap.delete(node)
   Array.isArray(node.children) && node.children.forEach(item => deleteErrorInResultMap(item))
 }
+let platformGetTagNamespace
+let basename
+let refId
 
 function baseWarn (msg) {
   console.warn(('[template compiler]: ' + msg))
@@ -210,7 +311,7 @@ function decode (value) {
 
 const i18nFuncNames = ['\\$(t)', '\\$(tc)', '\\$(te)', '\\$(d)', '\\$(n)']
 const i18nWxsPath = normalize.lib('runtime/i18n.wxs')
-const i18nWxsLoaderPath = normalize.lib('wxs/i18n-loader.js')
+const i18nWxsLoaderPath = normalize.lib('wxs/wxs-i18n-loader.js')
 // 添加~前缀避免wxs绝对路径在存在projectRoot时被拼接为错误路径
 const i18nWxsRequest = '~' + i18nWxsLoaderPath + '!' + i18nWxsPath
 const i18nModuleName = '__i18n__'
@@ -497,8 +598,8 @@ function parseHTML (html, options) {
 
 function parseComponent (content, options) {
   mode = options.mode || 'wx'
+  defs = options.defs || {}
   env = options.env
-  filePath = options.filePath
 
   let sfc = {
     template: null,
@@ -548,9 +649,6 @@ function parseComponent (content, options) {
             if (/^application\/json/.test(currentBlock.type) || currentBlock.name === 'json') {
               tag = 'json'
             }
-            if (currentBlock.name === 'json') {
-              currentBlock.useJSONJS = true
-            }
           }
           if (currentBlock.mode && currentBlock.env) {
             if (currentBlock.mode === mode && currentBlock.env === env) {
@@ -594,6 +692,9 @@ function parseComponent (content, options) {
       if (attr.name === 'scoped') {
         block.scoped = true
       }
+      if (attr.name === 'module') {
+        block.module = attr.value || true
+      }
       if (attr.name === 'src') {
         block.src = attr.value
       }
@@ -609,15 +710,20 @@ function parseComponent (content, options) {
     }
   }
 
-  function end (tag, start) {
+  function end (tag, start, end) {
     if (depth === 1 && currentBlock) {
       currentBlock.end = start
       let text = content.slice(currentBlock.start, currentBlock.end)
       // pad content so that linters and pre-processors can output correct
       // line numbers in errors and warnings
-      if (options.pad) {
+      if (currentBlock.tag !== 'template' && options.pad) {
         text = padContent(currentBlock, options.pad) + text
       }
+
+      // 对于<script name="json">的标签，传参调用函数，其返回结果作为json的内容
+      if (currentBlock.tag === 'script' && !/^application\/json/.test(currentBlock.type) && currentBlock.name === 'json') {
+        text = mpxJSON.compileMPXJSONText({ source: text, defs, filePath: options.filePath })
+      }
       currentBlock.content = text
       currentBlock = null
     }
@@ -668,7 +774,7 @@ function parse (template, options) {
   defs = options.defs || {}
   srcMode = options.srcMode || mode
   isNative = options.isNative
-  filePath = options.filePath
+  basename = options.basename
   i18n = options.i18n
   refId = 0
 
@@ -719,6 +825,16 @@ function parse (template, options) {
         attrs = guardIESVGBug(attrs)
       }
 
+      if (options.globalMpxAttrsFilter) {
+        attrs = modifyAttrsFromCurMpxAttrOptions(attrs, normalizePlatformMpxAttrsOpts(options.globalMpxAttrsFilter({
+          tagName: tag,
+          attrs,
+          __mpx_mode__: mode,
+          filePath: options.filePath
+        }) || {}))
+      }
+      attrs = consumeMpxCommentAttrs(attrs, mode)
+
       let element = createASTElement(tag, attrs, currentParent)
       if (ns) {
         element.ns = ns
@@ -733,11 +849,27 @@ function parse (template, options) {
         )
       }
 
+      // single root
+      // // gen root
+      // if (!root) {
+      //   root = element
+      // } else {
+      //   // mount element
+      //   if (currentParent) {
+      //     currentParent.children.push(element)
+      //     element.parent = currentParent
+      //   } else {
+      //     multiRootError = true
+      //     return
+      //   }
+      // }
+
       // multi root
       if (!currentParent) genTempRoot()
 
       currentParent.children.push(element)
       element.parent = currentParent
+
       processElement(element, root, options, meta)
       tagNames.add(element.tag)
 
@@ -800,7 +932,10 @@ function parse (template, options) {
     },
     comment: function comment (text) {
       if (!currentParent) genTempRoot()
-      if (options.hasComment) {
+      // special comments should not be output
+      if (isMpxCommentAttrs(text)) {
+        produceMpxCommentAttrs(text)
+      } else if (options.hasComment) {
         currentParent.children.push({
           type: 3,
           text: text,
@@ -811,6 +946,8 @@ function parse (template, options) {
     }
   })
 
+  assertMpxCommentAttrsEnd()
+
   if (multiRootError) {
     error$1('Template fields should has one single root, considering wrapping your template content with <view> or <text> tag!')
   }
@@ -904,19 +1041,6 @@ function modifyAttr (el, name, val) {
   }
 }
 
-function moveBaseDirective (target, from, isDelete = true) {
-  target.for = from.for
-  target.if = from.if
-  target.elseif = from.elseif
-  target.else = from.else
-  if (isDelete) {
-    delete from.for
-    delete from.if
-    delete from.elseif
-    delete from.else
-  }
-}
-
 function stringify (str) {
   return JSON.stringify(str)
 }
@@ -1013,6 +1137,15 @@ function processComponentIs (el, options) {
   }
 }
 
+// function processComponentDepth (el, options) {
+//   if (isComponentNode(el,options)) {
+//     addAttrs(el, [{
+//       name: 'mpxDepth',
+//       value: '{{mpxDepth + 1}}'
+//     }])
+//   }
+// }
+
 const eventIdentifier = '__mpx_event__'
 
 function parseFuncStr2 (str) {
@@ -1420,13 +1553,9 @@ function postProcessWxs (el, meta) {
         content = el.children.filter((child) => {
           return child.type === 3 && !child.isComment
         }).map(child => child.text).join('\n')
-
-        const fakeRequest = filePath + config[mode].wxs.ext
-
-        src = addQuery(`~${fakeRequest}!=!${filePath}`, {
+        src = addQuery('./' + basename, {
           wxsModule: module
         })
-
         addAttrs(el, [{
           name: config[mode].wxs.src,
           value: src
@@ -1507,9 +1636,9 @@ function postProcessFor (el) {
 }
 
 function evalExp (exp) {
+  // eslint-disable-next-line no-new-func
   let result = { success: false }
   try {
-    // eslint-disable-next-line no-new-func
     const fn = new Function(`return ${exp};`)
     result = {
       success: true,
@@ -1813,57 +1942,36 @@ function processBuiltInComponents (el, meta) {
   }
 }
 
-function processAliEventHack (el, options, root) {
-  // 只处理组件根节点
-  if (!(options.isComponent && el === root && isRealNode(el))) {
-    return
-  }
-  const { proxyComponentEventsRules } = options
-  let fallThroughEvents = ['onTap']
-  // 判断当前文件是否在范围中
-  const filePath = options.filePath
-  for (let item of proxyComponentEventsRules) {
-    const {
-      include,
-      exclude
-    } = item || {}
-
-    if (matchCondition(filePath, {
-      include,
-      exclude
-    })) {
-      const eventsRaw = item.events
-      const events = Array.isArray(eventsRaw) ? eventsRaw : [eventsRaw]
-      fallThroughEvents = Array.from(new Set(fallThroughEvents.concat(events)))
-      break
-    }
-  }
-
-  fallThroughEvents.forEach((type) => {
-    addAttrs(el, [{
-      name: type,
-      value: '__proxyEvent'
-    }])
-  })
-}
-
 function processAliStyleClassHack (el, options, root) {
+  let processor
+  // 处理组件标签
+  if (isComponentNode(el, options)) processor = ({ value, typeName }) => [typeName, value]
   // 处理组件根节点
   if (options.isComponent && el === root && isRealNode(el)) {
-    ['style', 'class'].forEach((type) => {
-      let exp = getAndRemoveAttr(el, type).val
-      let typeName = type === 'class' ? 'className' : type
-      let sep = type === 'style' ? ';' : ' '
-      let newValue = exp ? `{{${typeName}||''}}${sep}${exp}` : `{{${typeName}||''}}`
-
-      if (newValue !== undefined) {
-        addAttrs(el, [{
-          name: type,
-          value: newValue
-        }])
-      }
+    processor = ({ name, value, typeName }) => {
+      let sep = name === 'style' ? ';' : ' '
+      value = value ? `{{${typeName}||''}}${sep}${value}` : `{{${typeName}||''}}`
+      return [name, value]
+    }
+  }
+  // 非上述两种不处理
+  if (!processor) return
+  // 处理style、class
+  ['style', 'class'].forEach((type) => {
+    let exp = getAndRemoveAttr(el, type).val
+    let typeName = 'mpx' + type.replace(/^./, (matched) => matched.toUpperCase())
+    let [newName, newValue] = processor({
+      name: type,
+      value: exp,
+      typeName
     })
-  }
+    if (newValue !== undefined) {
+      addAttrs(el, [{
+        name: newName,
+        value: newValue
+      }])
+    }
+  })
 }
 
 // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。
@@ -2072,22 +2180,10 @@ function processElement (el, root, options, meta) {
     processComponentGenericsForWeb(el, options, meta)
     return
   }
-  if (mode === 'tenon') {
-    // 收集内建组件
-    processBuiltInComponents(el, meta)
-    // 预处理代码维度条件编译
-    processIfForWeb(el)
-    // processWebExternalClassesHack(el, options)
-    // processComponentGenericsForWeb(el, options, meta)
-    return
-  }
 
   const pass = isNative || processTemplate(el) || processingTemplate
 
-  // 仅ali平台需要scoped模拟样式隔离
-  if (mode === 'ali') {
-    processScoped(el, options)
-  }
+  processScoped(el, options)
 
   if (transAli) {
     processAliExternalClassesHack(el, options)
@@ -2103,9 +2199,9 @@ function processElement (el, root, options, meta) {
     processShow(el, options, root)
   }
 
-  if (transAli) {
+  // 当mode为ali不管是不是跨平台都需要进行此处理，以保障ali当中的refs相关增强能力正常运行
+  if (mode === 'ali') {
     processAliStyleClassHack(el, options, root)
-    processAliEventHack(el, options, root)
   }
 
   if (!pass) {
@@ -2118,7 +2214,7 @@ function processElement (el, root, options, meta) {
 
 function closeElement (el, meta) {
   postProcessAtMode(el)
-  if (mode === 'web' || mode === 'tenon') {
+  if (mode === 'web') {
     postProcessWxs(el, meta)
     // 处理代码维度条件编译移除死分支
     postProcessIf(el)
@@ -2166,16 +2262,14 @@ function postProcessComponentIs (el) {
     let tempNode
     if (el.for || el.if || el.elseif || el.else) {
       tempNode = createASTElement('block', [])
-      moveBaseDirective(tempNode, el)
+      tempNode.for = el.for
+      tempNode.if = el.if
+      tempNode.elseif = el.elseif
+      tempNode.else = el.else
     } else {
       tempNode = getTempNode()
     }
-    let range = []
-    if (el.attrsMap.range) {
-      range = getAndRemoveAttr(el, 'range').val.split(',')
-    }
     el.components.forEach(function (component) {
-      if (range.length > 0 && !range.includes(component)) return
       let newChild = createASTElement(component, cloneAttrsList(el.attrsList), tempNode)
       newChild.if = {
         raw: `{{${el.is} === ${stringify(component)}}}`,
@@ -2192,7 +2286,7 @@ function postProcessComponentIs (el) {
     if (!el.parent) {
       error$1('Dynamic component can not be the template root, considering wrapping it with <view> or <text> tag!')
     } else {
-      el = replaceNode(el, tempNode, true) || el
+      el = replaceNode(el, tempNode) || el
     }
   }
   return el
@@ -2227,7 +2321,7 @@ function serialize (root) {
           result += node.text
         }
       }
-      if (node.tag === 'wxs' && (mode === 'web' || mode === 'tenon')) {
+      if (node.tag === 'wxs' && mode === 'web') {
         return result
       }
       if (node.type === 1) {
@@ -2392,6 +2486,5 @@ module.exports = {
   makeAttrsMap,
   stringifyAttr,
   parseMustache,
-  stringifyWithResolveComputed,
-  addAttrs
+  stringifyWithResolveComputed
 }