zoukankan      html  css  js  c++  java
  • [AST Tools] Babel template: replace JQuery

    For example we have following code:

    $(el).hide() // el.style.display = 'none'
    $(el).forEach(() => {})
    foo.hide()

    We want

    $(el).hide()

    replace with:

    el.style.display = 'none'

    Plugin:

    export default function (babel) {
      const { types: t, template } = babel;
      
      return {
        name: "ast-transform", // not required
        visitor: {
          CallExpression(path) {
    
              const isJqueryCallExpression = looksLike(path, {
                node: {
                    callee: {
                        name: '$'
                    }
                },
                parent: {
                    type: "MemberExpression",
                    property: {
                        name: 'hide'
                    }
                }
            });
            
            if (!isJqueryCallExpression) {
                return 
            }
            const overallPath = path.parentPath.parentPath;
            const templateString = `EL.style.display = 'none';`
            const assignmentBuilder = template(templateString)
            const assignment = assignmentBuilder({
                EL: t.identifier(path.node.arguments[0].name)
            })
            overallPath.replaceWith(assignment)
          }
        }
      };
    }
    
    
    function looksLike(a, b) {
      return (
        a &&
        b &&
        Object.keys(b).every(bKey => {
          const bVal = b[bKey]
          const aVal = a[bKey]
          if (typeof bVal === 'function') {
            return bVal(aVal)
          }
          return isPrimitive(bVal) ? bVal === aVal : looksLike(aVal, bVal)
        })
      )
    }
    
    function isPrimitive(val) {
      return val == null || /^[sbn]/.test(typeof val)
    }
  • 相关阅读:
    linux 静态库和动态库(共享库)的制作与使用
    实现linux mkdir命令
    行间距和文本样式
    单位和字体
    html标签2
    css层叠样式表
    html标签
    html简介
    数据数组
    Redis的使用
  • 原文地址:https://www.cnblogs.com/Answer1215/p/12421646.html
Copyright © 2011-2022 走看看