https://github.com/anilanar/gbd

Print and return the value of a given expression for quick and dirty debugging.
https://github.com/anilanar/gbd

babel babel-macro debug javascript typescript

Last synced: 7 days ago
JSON representation

Print and return the value of a given expression for quick and dirty debugging.

• Host: GitHub
• URL: https://github.com/anilanar/gbd
• Owner: anilanar
• License: mit
• Created: 2020-04-10T13:18:26.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-07-11T02:52:27.000Z (over 1 year ago)
• Last Synced: 2024-10-31T18:31:15.461Z (15 days ago)
• Topics: babel, babel-macro, debug, javascript, typescript
• Language: TypeScript
• Homepage:
• Size: 792 KB
• Stars: 3
• Watchers: 4
• Forks: 0
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# 🐸 `gbd.macro`

`gbd.macro` is a [babel plugin macro](https://github.com/kentcdodds/babel-plugin-macros) that "prints and returns the value of a given expression for quick and dirty debugging". It is a shameless port of rust's `dbg!` macro.

`gbd.macro` is Typescript ready!

---

## How to use

```

npm install gbd.macro --save-dev

```

```

yarn add gbd.macro -D

```

## Examples

```typescript

import { gbd } from 'gbd.macro';

function trimAll = (strings: string[]) => strings.map(str => gbd(str.trim()));

console.log(

    "Result: ",

    trimAll([" hi ", " everyone! "]).join(' ')

);

```

```

# Prints

> str.trim()

= "hi"

> str.trim()

= "everyone"

"Result: hi everyone!

```

---

```typescript

import { gbd } from "gbd.macro";

const a = 2;

const b = gbd(a * 2) + 1;

b === 5; // true

```

```

# Prints

> a * 2

= 4

```

---

```typescript

import { gbd } from "gbd.macro";

function foo(n: number) {

  if (gbd(n / 4) === 0) {

    // Do something

  }

}

foo(3);

```

```

# Prints

> n / 4

= 0.75

```

---

```typescript

import { gbd } from 'gbd.macro';

function factorial(n: number): number {

    if gbd(n <= 1) {

        return gbd(1);

    } else {

        return gbd(n * factorial(n - 1))

    }

}

gbd(factorial(4));

```

```

# Prints

> n <= 1

= false

> n <= 1

= false

n <= 1

= false

n <= 1

= true

> 1

= 1

> n * factorial(n - 1)

= 2

> n * factorial(n - 1)

= 6

> n * factorial(n - 1)

= 24

> factorial(4)

= 24

```

---

## How it works

When you use `gbd.macro`, the following transformation happens:

```

import { gbd } from 'gbd.macro';

gbd(1 + 2);

      ↓ ↓ ↓ ↓ ↓ ↓

import { gbd } from 'gbd';

gbd(1 + 2, "1 + 2");

```

`gbd` is implemented roughly as follows:

```javascript

import format from "pretty-format";

export function gbd(val, expr) {

  console.debug(`> ${expr}\n= ${format(val)}`);

  return val;

}

```

---

## Inspiration

- A [tweet](https://twitter.com/frontsideair/status/124778767098343014) from [Fatih Altinok](https://twitter.com/frontsideair).

- [rust's dbg!](https://doc.rust-lang.org/std/macro.dbg.html).

## License

MIT