@mpxjs/webpack-plugin 2.6.115 → 2.7.0-alpha

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('../staticConfig')
+const { MPX_ROOT_VIEW, MPX_APP_MODULE_ID } = require('../utils/const')
 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,107 +130,6 @@ 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)
@@ -254,6 +153,9 @@ let forScopesMap = {}
 let hasI18n = false
 let i18nInjectableComputed = []
 let env
+let platformGetTagNamespace
+let filePath
+let refId
 
 function updateForScopesMap () {
   forScopes.forEach((scope) => {
@@ -280,9 +182,6 @@ 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))
@@ -311,7 +210,7 @@ function decode (value) {
 
 const i18nFuncNames = ['\\$(t)', '\\$(tc)', '\\$(te)', '\\$(d)', '\\$(n)']
 const i18nWxsPath = normalize.lib('runtime/i18n.wxs')
-const i18nWxsLoaderPath = normalize.lib('wxs/wxs-i18n-loader.js')
+const i18nWxsLoaderPath = normalize.lib('wxs/i18n-loader.js')
 // 添加~前缀避免wxs绝对路径在存在projectRoot时被拼接为错误路径
 const i18nWxsRequest = '~' + i18nWxsLoaderPath + '!' + i18nWxsPath
 const i18nModuleName = '__i18n__'
@@ -598,8 +497,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,
@@ -649,6 +548,9 @@ 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) {
@@ -692,9 +594,6 @@ 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
       }
@@ -710,20 +609,15 @@ function parseComponent (content, options) {
     }
   }
 
-  function end (tag, start, end) {
+  function end (tag, start) {
     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 (currentBlock.tag !== 'template' && options.pad) {
+      if (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
     }
@@ -774,7 +668,7 @@ function parse (template, options) {
   defs = options.defs || {}
   srcMode = options.srcMode || mode
   isNative = options.isNative
-  basename = options.basename
+  filePath = options.filePath
   i18n = options.i18n
   refId = 0
 
@@ -825,16 +719,6 @@ 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
@@ -849,27 +733,11 @@ 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)
 
@@ -932,10 +800,7 @@ function parse (template, options) {
     },
     comment: function comment (text) {
       if (!currentParent) genTempRoot()
-      // special comments should not be output
-      if (isMpxCommentAttrs(text)) {
-        produceMpxCommentAttrs(text)
-      } else if (options.hasComment) {
+      if (options.hasComment) {
         currentParent.children.push({
           type: 3,
           text: text,
@@ -946,8 +811,6 @@ 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!')
   }
@@ -1041,6 +904,19 @@ 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)
 }
@@ -1137,15 +1013,6 @@ 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) {
@@ -1553,9 +1420,13 @@ function postProcessWxs (el, meta) {
         content = el.children.filter((child) => {
           return child.type === 3 && !child.isComment
         }).map(child => child.text).join('\n')
-        src = addQuery('./' + basename, {
+
+        const fakeRequest = filePath + config[mode].wxs.ext
+
+        src = addQuery(`~${fakeRequest}!=!${filePath}`, {
           wxsModule: module
         })
+
         addAttrs(el, [{
           name: config[mode].wxs.src,
           value: src
@@ -1636,9 +1507,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,
@@ -1942,36 +1813,57 @@ 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)) {
-    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
+    ['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
+        }])
+      }
     })
-    if (newValue !== undefined) {
-      addAttrs(el, [{
-        name: newName,
-        value: newValue
-      }])
-    }
-  })
+  }
 }
 
 // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。
@@ -2180,10 +2072,22 @@ 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
 
-  processScoped(el, options)
+  // 仅ali平台需要scoped模拟样式隔离
+  if (mode === 'ali') {
+    processScoped(el, options)
+  }
 
   if (transAli) {
     processAliExternalClassesHack(el, options)
@@ -2199,9 +2103,9 @@ function processElement (el, root, options, meta) {
     processShow(el, options, root)
   }
 
-  // 当mode为ali不管是不是跨平台都需要进行此处理，以保障ali当中的refs相关增强能力正常运行
-  if (mode === 'ali') {
+  if (transAli) {
     processAliStyleClassHack(el, options, root)
+    processAliEventHack(el, options, root)
   }
 
   if (!pass) {
@@ -2214,7 +2118,7 @@ function processElement (el, root, options, meta) {
 
 function closeElement (el, meta) {
   postProcessAtMode(el)
-  if (mode === 'web') {
+  if (mode === 'web' || mode === 'tenon') {
     postProcessWxs(el, meta)
     // 处理代码维度条件编译移除死分支
     postProcessIf(el)
@@ -2262,14 +2166,16 @@ function postProcessComponentIs (el) {
     let tempNode
     if (el.for || el.if || el.elseif || el.else) {
       tempNode = createASTElement('block', [])
-      tempNode.for = el.for
-      tempNode.if = el.if
-      tempNode.elseif = el.elseif
-      tempNode.else = el.else
+      moveBaseDirective(tempNode, el)
     } 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)}}}`,
@@ -2286,7 +2192,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) || el
+      el = replaceNode(el, tempNode, true) || el
     }
   }
   return el
@@ -2321,7 +2227,7 @@ function serialize (root) {
           result += node.text
         }
       }
-      if (node.tag === 'wxs' && mode === 'web') {
+      if (node.tag === 'wxs' && (mode === 'web' || mode === 'tenon')) {
         return result
       }
       if (node.type === 1) {
@@ -2486,5 +2392,6 @@ module.exports = {
   makeAttrsMap,
   stringifyAttr,
   parseMustache,
-  stringifyWithResolveComputed
+  stringifyWithResolveComputed,
+  addAttrs
 }