Skip to content

TheElegantCoding/logginlys

Repository files navigation

divider Logginlys


divider

  📦 SETUP⚙️ CONFIGURATION

divider


                   

divider

About

Logginlys is a lightweight, high-performance TypeScript logging library designed to provide a consistent visual experience across both Node.js (Terminal) and Browser environments.

Forget about messy `console.log` statements. Logginlys automatically detects your environment and applies beautiful ANSI styles or CSS badges to keep your debugging process organized and readable.

divider

Table of content

divider

Requirements

  • node >= 22.17.0
  • bun >= 1.1.0

divider

Installation

Bun

bun i -D logginlys

Npm

npm i -D logginlys

Pnpm

pnpm i -D logginlys

Yarn

yarn i -D logginlys

divider

Usage

General use is as simple as importing the log object and calling its methods:

import { log } from 'logginlys';

log.info('This is an info message');
log.success('This is a success message');
log.error('This is an error message');
log.warning('This is a warning message');
log.debug('This is a debug message');
log.log('This is a log message');
log.blank();
log.setup('This is a setup message');
log.http({
  url: 'https://example.com/api/data?query=123',
  method: 'GET',
  status: 200,
  time: 150
});
log.httpError('This is a HTTP error message', {
  url: 'https://example.com/api/data?query=123',
  method: 'POST',
  status: 500,
  time: 300
});

The result will be this:


divider

Configuration

You can customize the logger by passing an options object to the Logger class constructor or to each log method. The options object can have the following properties:

  • prefix (string): A custom prefix to be added before each log message.
  • isDev (boolean): A flag to enable or disable logging. If set to false, all log methods will be no-ops.
  • showTimestamp (boolean): A flag to enable or disable timestamps in log messages.
  • showBadge (boolean): A flag to enable or disable badges in log messages.
  • blankAbove (boolean): A flag to add a blank line above the log message.
  • blankBelow (boolean): A flag to add a blank line below the log message.
  • icon (string): A custom icon to be displayed before the log message (only for ansi).
  • emoji (string): A custom emoji to be displayed before the log message (only for browser).
  • ansi (object): An object to customize ANSI styles for terminal logs, with properties color and bg for text color and background color respectively.
  • css (object): An object to customize CSS styles for browser logs, with properties color and bg for text color and background color respectively.

Log level specific styles

  • log, info, http, debug, error, setup, warning, success (object): Objects to customize styles for specific log levels, with the same properties as above.
  • http (object): An object to customize styles for HTTP logs, with the same properties as above.
  • httpError (object): An object to customize styles for HTTP error logs, with the same properties as above.
  • box (object): An object to customize styles for box logs, with the same properties as above.
  • loader (object): An object to customize styles for loader logs, with the same properties as above.

To customize the logger globally, you can do the following:

import { LogManager } from 'logginlys';

const logger = new LogManager({
  prefix: '[My App]',
  isDev: true,
  showTimestamp: true,
  blankAbove: false,
  blankBelow: false,
  info: {
    icon: '\uebc6',
    emoji: 'ℹ️',
  },
  setup: {
    icon: '\uebd7',
    emoji: '⚙️',
    ansi: {
      color: '\u001b[0;36m',
      bg: '\u001b[46m'
    }
  },
});

logger.info('This is an info message');
logger.setup('This is a setup message');

Resulting in this:


In case you want to customize one log message you can do the following:

import { LogManager } from 'logginlys';

const log = new LogManager();

log.info('This is an info message with custom styles', {
  prefix: '[Custom Prefix]',
  showTimestamp: false,
  icon: '\uebc6',
  emoji: 'ℹ️',
  ansi: {
    color: '\u001b[0;36m',
    bg: '\u001b[46m'
  }
});
log.success('This is a success message', { blankAbove: true });

Resulting in this:


To log box messages, you can use the log.box method:

import { LogManager } from 'logginlys';

const log = new LogManager();

log.box('Box message');

log.box('Box message', {
  blankAbove: true,
  blankBelow: true,
  boxStyle: 'bold',
  width: 40,
  height: 7,
  ansi: {
    color: colorAnsi.green,
    borderColor: colorAnsi.blue
  },
  css: {
    color: colorCss.green,
    borderColor: colorCss.blue,
    bgColor: colorCss.bgBlack,
    padding: '10px 15px'
  }
});

Resulting in this:


To use loader logs, you can use the log.loader method:

const loader = logger.loader({
  message: 'Loading...',
  position: 'left',
  color: colorAnsi.cyan
});

loader.start();
loader.stop('Finished loading!', icon.check);


In case you want to create your own custom log method, you can extend the LogManager class and add your custom method:

class MyCustomLogger extends LogManager {
  typescript(message: string, options?: LoggerStyleParameters) {
    const tsStyle: LoggerStyleParameters = {
      ansi: { color: '\u001b[36m' },
      showBadge: false,
      emoji: '🟦',
      icon: 'TS'
    };
    
    this.custom(message, { ...options, ...tsStyle });
  }
}

const log = new MyCustomLogger();
log.typescript('This is a custom TypeScript log message');

divider

  BACK TO TOP

divider

  Copyright © All rights reserved,
  developed by LuisdaByte and

About

📦️ A lightweight, high-performance TypeScript logger with automatic environment detection for consistent ANSI and CSS styling in Node.js and Browser.

Topics

Resources

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors