babel-plugin-annotate-console-log

Annotates console.log call expression with information about the invocation context.

Usage no npm install needed!

<script type="module">
  import babelPluginAnnotateConsoleLog from 'https://cdn.skypack.dev/babel-plugin-annotate-console-log';
</script>

README

babel-plugin-annotate-console-log

Travis build status NPM version Canonical Code Style Twitter Follow

Annotates console.log call expression with information about the invocation context.

Works with console.error, console.info, console.log and console.warn.

Example transpilation

Input:

function foo () {
  function bar () {
    console.log('apple');
  }
}

class Foo {
  bar () {
    console.log('banana');
  }
}

Output:

function foo () {
  function bar () {
    console.log('foo() bar()', 'apple');
  }
}

class Foo {
  bar () {
    console.log('Foo->bar()', 'banana');
  }
}

Motivation

I often get lost between many console.log messages. The Chrome DevTools allow you to filter the console output. However, you need to manually annotate each console.log statement with useful information for filtering.

This plugin enriches every console.log statement with information useful for filtering the messages.