Skip to content
/ logsy Public

Logsy is a lightweight and zero dependency library for stylized logging in the browser console. It helps developers easily output structured and visually distinctive messages with custom styles, tags, and plugin support.

License

Notifications You must be signed in to change notification settings

Aspedm/logsy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

10 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Logsy

About

Logsy is a lightweight and zero dependency library for stylized logging in the browser console. It helps developers easily output structured and visually distinctive messages with custom styles, tags, and plugin support.

πŸ“¦ Installation

yarn add @wyeg/logsy

πŸš€ Quick Start

import { Logsy } from '@wyeg/logsy';

Logsy.log('App init completed');

πŸ“• Documentation

Available Log Methods

Name Description
Logsy.log() General-purpose logging
Logsy.info() Informational messages
logsy.warn() Warnings
Logsy.error() Errors and exceptions
Logsy.spinner() Async operation spinner

API Reference

All methods (except Logsy.spinner()) use the same API interface as console.log().

import { Logsy } from '@wyeg/logsy';

Logsy.log('Foo', { foo: 'bar' });
Logsy.info('Foo', { foo: 'bar' });
Logsy.warn('Foo', { foo: 'bar' });
Logsy.error('Foo', { foo: 'bar' }); 
// or 
Logsy.error('Foo', new Error('Error Message'));

Use Logsy.spinner() to indicate progress during asynchronous operations. The spinner message updates automatically when the promise resolves or rejects.

import { Logsy } from '@wyeg/logsy';

const fetchData = () => new Promise((resolve) => setTimeout(() => resolve({ user: 'Tom' }), 2000));
Logsy.spinner('User', fetchData());

Available options

Name Type Description
logsy boolean Required flag to identify the object as Logsy options
style string Custom CSS rules to style the message
label string LogTags
import { Logsy } from '@wyeg/logsy';

Logsy.warn('Deprecated method', { logsy: true, label: LogTags.DEPRECATED });

Logsy.warn(
  'Field "card" is deprecated',
  { logsy: true, label: LogTags.DEPRECATED },
  { card: 123, cardNumber: 123 }
);

To customize label color, use the getLabelStyle() helper:

import { Logsy, getLabelStyle } from '@wyeg/logsy';

Logsy.error('Something failed', { logsy: true, style: getLabelStyle('red') });
Logsy.log('Styled message', {
  logsy: true,
  style: 'color: lightgreen; background-color: darkgrey;',
});

Plugins

Built-in

πŸ•΅οΈ 1. redactSensitiveDataPlugin Automatically redacts sensitive fields from log data:

import { Logsy, redactSensitiveDataPlugin } from '@wyeg/logsy';

Logsy.use(redactSensitiveDataPlugin);

Logsy.log('User', {
  email: 'user@example.com',
  password: 'hunter2',
  token: 'abc123xyz',
  apiKey: 'secretkey123',
  profile: {
    creditCard: '4111111111111111',
    cvv: 123,
    other: 'safeValue',
  },
});

Output:

{
  email: 'user@example.com',
  password: '********',
  token: '********',
  apiKey: '********',
  profile: {
    creditCard: '********',
    cvv: '****',
    other: 'safeValue'
  }
}

Sensitive fields:

  • phone
  • address
  • creditcardnumber
  • password
  • secret
  • token
  • apikey
  • accesskey
  • privatekey
  • sensitive
  • confidential
  • creditcard
  • ssn
  • socialsecuritynumber
  • bankaccount
  • bankaccountnumber
  • routingnumber
  • iban
  • pin
  • cvv
  • cvc
  • otp
  • onetimepassword
  • securitycode
  • authcode
  • authtoken
  • authsecret
  • authkey
  • jwt

🚧 2. devOnlyPlugin Prevents logging in non-development environments (NODE_ENV !== 'development'):

import { Logsy, devOnlyPlugin } from '@wyeg/logsy';

Logsy.use(devOnlyPlugin);

Logsy.log('This will only be logged in development');

Create new plugin

You can create custom plugins that transform log data or hook into the logging lifecycle.

export interface ILogsyPlugin {
    /**
     * Transform the log message and its arguments.
     * @param message The log message.
     * @param rest The rest of the arguments.
     * @returns An object containing the transformed message and arguments.
     */
    transform?: (message: string, rest: unknown[]) => {
        message: string;
        rest: unknown[];
    };

    /**
     * Called before the log message is emitted.
     * @param level The log level.
     * @param message The log message.
     * @param rest The rest of the arguments.
     */
    beforeLog?: (level: TLogLevel, message: string, rest: unknown[]) => void;

    /**
     * Called after the log message is emitted.
     * @param level The log level.
     * @param message The log message.
     * @param rest The rest of the arguments.
     */
    afterLog?: (level: TLogLevel, message: string, rest: unknown[]) => void;
}

Avaiables log levels are log, info, warn, error.

πŸ“œ License

Further details see LICENSE file.

πŸ“§ Contact

If you have any questions, suggestions, or issues, please create an issue in the GitHub repository or contact me at aspedm@gmail.com.

About

Logsy is a lightweight and zero dependency library for stylized logging in the browser console. It helps developers easily output structured and visually distinctive messages with custom styles, tags, and plugin support.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks