For example we have current code:

function add(a, b) {
console.log(a, b)
return a + b
} function subtract(a, b) {
console.log(a, b)
return a - b
} add(, )
subtract(, )
console.log('sup dawg')

We want to transform the code to:

function add(a, b) {
console.log("2:4", a, b)
return a + b
} function subtract(a, b) {
console.log("7:4", a, b)
return a - b
} add(, )
subtract(, )
console.log("13:0", 'sup dawg')

Added line and colum number in front of console log arguements

Using the utilites functions:

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)
}

Babel plugin code:

export default function (babel) {
const { types: t } = babel; return {
name: "ast-transform", // not required
visitor: {
CallExpression(path) {
if (!looksLike(path.node, {
callee: {
type: 'MemberExpression',
object: {
name: 'console'
},
property: {
name: 'log'
}
}
})) {
return
}
console.log(path.node.loc)
// insert string into console.log('instread here', a,b)
const {line, column} = path.node.loc.start;
path.node.arguments.unshift(t.stringLiteral(`${line}:${column}`))
}
}
};
}

[AST Babel Plugin] Transform code, add line:column number for console log的更多相关文章

  1. [Javascirpt AST] Babel Plugin -- create new CallExpression

    The code we want to trasform: 2 ** 3; a ** b; a **b * c; a ** b ** c; (a+1) ** (b+1); transform to: ...

  2. [AST Babel Plugin] Hanlde ArrowFunction && FunctionExpression

    Continue with previous post: https://www.cnblogs.com/Answer1215/p/12342540.html Now we need to think ...

  3. [AST Babel] Add function name into the console log 'path.findParent(t.isFunctionDeclaration)'

    Continue with the previous post: https://www.cnblogs.com/Answer1215/p/12337243.html What we want to ...

  4. [Javascript AST] 1. Continue: Write a simple Babel plugin

    We want to write a Babel Plugin, which move 'const versionRegex = /(/d+)\.(/d+)\.(/d+)/gi' out of fu ...

  5. 简单 babel plugin 开发-使用lerna 工具

    babel在现在的web 应用开发上具有很重要的作用,帮助我们做了好多事情,同时又有 比较多的babel plugin 可以解决我们实际开发上的问题. 以下只是学习下如果编写一个简单的babel pl ...

  6. Error Code: 1054. Unknown column 'age' in 'user'

    1.错误描述 10:28:20 alter table user modify age int(3) after sex Error Code: 1054. Unknown column 'age' ...

  7. Mysql官方文档中争对安全添加列的处理方法。Mysql Add a Column to a table if not exists

    Add a Column to a table if not exists MySQL allows you to create a table if it does not exist, but d ...

  8. babel plugin和presets是什么,怎么用?

    https://www.fullstackreact.com/articles/what-are-babel-plugins-and-presets/ 当开发react或者vuejs app时,开发者 ...

  9. Error Code: 1054. Unknown column '字段名' in 'field list'

    问题描述: j博主在java开发过程中,通过读取excel中表名和字段名,动态创建insert的SQL语句,在mysql可视化工具中执行此SQL语句时,一直提示"Error Code: 10 ...

随机推荐

  1. AntDesign(React)学习-11 使用mobx

    mobx 是由 Mendix.Coinbase.Facebook 开源和众多个人赞助商所赞助的. mobx和redux类似,也可以用来进行状态管理,并且更简单,更灵活.初次研究,先实现一个最简单的功能 ...

  2. 解决sql server2008数据库安装之后,web程序80端口被占用问题(终极方案)

    解决sql server2008数据库安装之后,web程序80端口被占用问题(终极方案) 前言:原来电脑上的Apache一直使用正常,在安装sql server2008后,突然发现Apache无法启动 ...

  3. JS高级---沙箱

    沙箱 沙箱: 环境, 黑盒, 在一个虚拟的环境中模拟真实世界, 做实验, 实验结果和真实世界的结果是一样, 但是不会影响真实世界     全局变量 var num=10; console.log(nu ...

  4. Python RSA

    # -*- coding: utf-8 -*- from Crypto import Random from Crypto.Hash import SHA from Crypto.Cipher imp ...

  5. 前端框架-Vue 入门

    一.介绍 1.Vue.js 是什么 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架. Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合. ...

  6. kao shi di er ti(还没有订正)

    // 离散化点 思路应该是对的 吧 但没时间去检查编译上的错误 #include <bits/stdc++.h> using namespace std; ; #define ri reg ...

  7. IIS支持json、geojson文件

    最近在搞asp.net + openlayers. 其中openlayer有个数据源支持 .geojson 数据,但是怎么测试都不能成功.同样的数据拿到php下就能成功显示. 搓. 在网上漫无目的的搜 ...

  8. 剪切文件或目录命令 - mv

    ①.命令名称:mv ②.英文原意:move ③.命令所在路径:/bin/mv ④.执行权限:所有用户 ⑤.功能描述:剪切文件.改名 ⑥.语法: mv[原文件或目录][目标目录] 例子:在 tmp目录下 ...

  9. MFC对话框常用操作文章收藏

    1.改变控件文本 参考链接:https://blog.csdn.net/active2489595970/article/details/88856235 所有控件的文本都可以用这种方式动态改变. 2 ...

  10. CentOS7下使用C/C++连接MariaDB/MySQL

    前言 连接数据库通常在Java中使用比较多,但是C/C++在Linux下操作数据库也是比较重要的,很多时候都能用得到,在网上查了很多教程,大多写的有些问题,通过自己摸索,终于成功的连接了MariaDB ...