# console-custom-tag

> Add a custom style prefix tag to the browser console

Latest version **1.0.3** (published 2024-03-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install console-custom-tag
pnpm add console-custom-tag
yarn add console-custom-tag
bun add console-custom-tag
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.3 |
| Published | 2024-03-25 |
| First published | 2024-03-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 5.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | rainbowxh |
| Keywords | browser, console, tag |

## Links

- npm: https://www.npmjs.com/package/console-custom-tag
- npm.io page: https://npm.io/package/console-custom-tag

## Dependencies (3)

- [lodash](https://npm.io/package/lodash.md) ^4.17.21
- [rollup-plugin-terser](https://npm.io/package/rollup-plugin-terser.md) ^7.0.2
- [monitor-event-emitter](https://npm.io/package/monitor-event-emitter.md) ^1.0.0

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 1.0.3 (latest) — 2024-03-25
- 1.0.2 — 2024-03-25
- 1.0.1 — 2024-03-25
- 1.0.0 — 2024-03-25

## README

# console-tag
Easier to see personal log in browser.

# Installation
```npm
npm i -S console-tag
```

# Usage
You need to install it before using it. `tag` config is required.
```javascript
        import consoleTag from '/dist/console-tag.bundle.js';
        consoleTag.install({
            enable: true, // false or true
            tag: {
                'test': {
                    tag: {
                        name: '[test-tag]',
                        style: 'color:white;background-color:#ecad9e;border-radius:4px;padding:2px 4px;font-size:12px;'
                    },
                    hook: () => {
                        console.log("I am a hook")
                    }
                }
            }
        });
        console.test('tag sth')
```
Tag Configuration supports customization.You can config your nickname and colorful tag.
```javascript 
        consoleTag.install({
            enable: true, // false or true
            tag: {
                'custom-name': { // terminate you want
                    tag: {
                        name: '[test-tag]', // tag show in console
                        style: 'color:white;background-color:#ecad9e;border-radius:4px;padding:2px 4px;font-size:12px;'
                    },
                    hook: () => {
                        console.log("I am a hook")
                    }
                }
            }
        });
```




# params 
```
install(config)
```
|  params        |  type        |   required |  description |
|  ----          |  ---        | ----          |  ---- |
| enable | boolean | false | It will take effect when the value is false, and supports configuration according to the environment.Example: dev debugging environment takes effect, production not `install({ enable: env === 'dev' ? true : false })` |
| tag | Object | true | Config commands what you want|
| &emsp;'customName'  | Object | true | 'customName' is the command u want. `console[customName]` | 
| &emsp;&emsp;tag | Object  | true | Tag style config | 
| &emsp;&emsp;&emsp;name | String | true | Tag context |
| &emsp;&emsp;&emsp;style | String | true | Tag style |
| &emsp;&emsp;hook | Function  | false | Hook function will be called before custom command. |

---
_Source: https://npm.io/package/console-custom-tag · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
