@codemantion/logger

[JS] Logger ( Simple & minimal )

An simple logger for browser console
Install · Report Bug · Request Feature

Table of Contents

1. About The Project
2. Installation
3. Usage
4. Config Options
5. Events

About The Project

A simple and lightweight logger for the browsers

(back to top)

Installation

• npm

  npm install @codemantion/logger

• yarn

  yarn add @codemantion/logger

Usage

import

import logger from "@codemantion/logger";

using log (.log)

logger.log("Your message");
logger.log("message1", "message2", "message3"); // multiple message
logger.log("info", "Your info message"); // with type

log types: log, info, warn, error

log output

[log]:info 2022-01-14T15:34:44.979Z: Your message

using info (.info)

logger.info("Your info message");
logger.info("message1", "message2", "message3"); // multiple message
logger.log("info", "Your info message"); // with type

info output

[log]:info 2022-01-14T15:34:44.979Z: Your info message

using warning (.worn)

logger.warn("Your warning message");
logger.warn("message1", "message2", "message3"); // multiple message
logger.log("warn", "Your warning message"); // with type

warning output

[log]:warn 2022-01-14T15:34:44.979Z: Your warning message

using warning (.error)

logger.error("Your error message");
logger.error("message1", "message2", "message3"); // multiple message
logger.log("error", "Your error message"); // with type

error output

[log]:error 2022-01-14T15:34:44.979Z: Your error message

Config Options

Override options

logger.setConfig({
  // remove label
  isShowLabel: false,
  
  // remove timestamp
  isShowTimestamp: false
});

Disable logging

logger.setConfig({
  isEnable: process.env.NODE_ENV === "development"
});

List of all options

key	Type	Default Value	Description
isEnable	boolean	true	Enable or disable logging
name	string	log	Name of the output log
styles	{  label: {    log: string;    info: string;    warn: string;    error: string;  }; }	{   label: {    log: 'background: #222; color: #bada55',    info: 'background: #222; color: #bada55',    warn: 'background: #ffdd76; color: #222',    error: 'background: #ffc0c0; color: #ff0000',  }, }	Override the css of label
templates	{  log: string;  timestamp: string; };	{  log: '[%name%]:%type%',  timestamp: '%timestamp%:', };	Template for printing label and timestamp
isShowLabel	boolean	true	Print log without label
isShowTimestamp	boolean	true	Print log without timestamp
isUseNative	boolean	false	Use native console on print logs
isPrintOnConsole	boolean	true	Print logs on console or not

Events

add event listener

logger.on("log", (message) => {
  console.log(message);
});

add and remove event listener

const onLog = (message) => {
  console.log(message);
};
logger.on("log", onLog);
// ...
// ...
logger.off("log", onLog);

for all events

const onLog = (message) => {
  console.log(message);
};
logger.on("*", onLog);
// ...
// ...
logger.off("*", onLog);

access log details

const onLog = (message) => {
  console.log(message);
  const { type, messages, originalMessages } = message.detail;
};
logger.on("*", onLog);