@saninn/logger

v1.2.0

Published

8 months ago

A configurable wrapper around the console object (without losing the console call position)

Downloads

0High
0Medium
0Low

saninn

console wrapper logger

👨‍💻💻

A configurable wrapper of the console that keeps the log call position.

Made with Typescript, usable as es6 module and iife (with IE10 support).

Licence

The Problem

You need to control when activate or deactivate your app or website logging but when your put console.log inside another class or function the console call position is lost. Well not anymore!

example

Install

npm install @saninn/logger.

If you want to use it as es6, commonjs or iife download the respective assets in the Releases Page. As alternative you can clone this project, run npm install and npm run build-bundles.

Note: The iife version contains a Polyfill for Javascript Proxy Api.

What can I do?

Set a prefix to all your console calls(log, warn, error, etc) so it is easy to filter while debugging;
Add a color to each console calls (supported in all browsers but Internet Explorer).
Set logger levels to prevent console flood (Debug, Info, Warn, Error and Fatal);
Process external loggers (like server side) with the same call as the local log.
Process just external loggers.
Procces just local loggers.
Register external loggers on run time.
Remove external loggers on run time.

Basic usage

Typescript

import { SaninnLogger } from '@saninn/logger';
const myLogger = new SaninnLogger('my-logger-prefix');
myLogger.log('this is a log'); // [my-logger-prefix]: this is a log.

Javascript (es6 module)

index.html

<head>
  <script src="main.js" type="module"></script>
</head>

main.js

import { SaninnLogger } from './node_modules/@saninn/logger/dist/@saninn__logger.js';
const myLogger = new SaninnLogger('my-logger-prefix');
myLogger.log('this is a log'); // [my-logger-prefix]: this is a log.

Javascript (es5)

First download the Immediately-invoked function expression (iife) from the Releases Page and import it before your javascript entry point

index.html

<head>
  <script src="@saninn__logger.js"></script>
  <script src="main.js"></script>
</head>

main.js

var myLogger = new SaninnLogger('my-logger-prefix');
myLogger.log('this is a log'); // [my-logger-prefix]: this is a log.

API and Documentation

enableGlobalLoggerFunctions(): void
disableGlobalLoggerFunctions(): void
enableLoggerProcessors(): void
disableLoggerProcessors(): void
addLoggerProcessor(logType: LoggerTypesEnum, loggerProcessor: LoggerProcessor): void
removeLoggerProcessor(logType: LoggerTypesEnum, loggerProcessor: LoggerProcessor): void
setLoggerLevelTo(level: LogLevelsEnum): void

Important!!

A log level set to INFO will print logger.log(), logger.info() and logger.dir() calls.

See the Documentation in https://logger.saninnsalas.com for full details.

Use cases

You can see the Wiki for ideas and use cases where @saninn/logger can help you!

Full options example

const loggerWithFullConfigAndProcessors = new SaninnLogger({
  useGlobalPreLoggerFunctions: true,
  globalPreLoggerFunctions: {
    dir: (prefix) => {
      console.log(
        'This is a DIR preLoggerFunction that is not the direct console.dir',
        'This is The Prefix:  ' + prefix
      );
    },
    error: (prefix) => {
      console.log(
        'This is a ERROR preLoggerFunction that is not the direct console.error',
        'This is The Prefix:  ' + prefix
      );
    },
    log: (prefix) => {
      console.log(
        'This is a LOG preLoggerFunction that is not the direct console.log',
        'This is The Prefix:  ' + prefix
      );
    },
    warn: (prefix) => {
      console.log(
        'This is a WARN preLoggerFunction that is not the direct console.warn',
        'This is The Prefix:  ' + prefix
      );
    },
  },
  prefix: 'full-config-logger',
  prefixColors: {
    error: 'blue',
    log: 'green',
    warn: 'red',
  },
  printToConsole: true,
  useLoggerProcessors: true,
  loggerProcessors: {
    log: [
      (prefix, args) => {
        console.log('FIRST logger Processor para saninnLogger.log');
        console.log('prefix: ', prefix);
        console.log('args: ', args);
      },
      (prefix, args) => {
        console.log('SECOND logger Processor para saninnLogger.log');
        console.log('prefix: ', prefix);
        console.log('args: ', args);
      },
    ],
  },
});

const dummyObject = {
  a: 1,
  b: 2,
  c: {
    d: 3,
    e: 4,
  },
};

const dummyFunction = function () {
  console.log('dummy function');
};
loggerWithFullConfigAndProcessors.log('log of loggerWithFullConfigAndProcessors', dummyObject, dummyFunction);
loggerWithFullConfigAndProcessors.warn('warn of loggerWithFullConfigAndProcessors');
loggerWithFullConfigAndProcessors.error('error of loggerWithFullConfigAndProcessors');
loggerWithFullConfigAndProcessors.dir('dir of loggerWithFullConfigAndProcessors');

console output

Use with JEST as test runner.

If you use jest as test runner you need to tell jest not to transform @saninn/logger using this in your jest config:

transformIgnorePatterns: ['<rootDir>/node_modules/(?!@saninn|@someOtherPackage)']

License

MIT

Development

This project uses:

Typescript in strict mode.
Prettier as code formater.
commitlint to assure the commits follow the conventional commit format.
jest as test runner.

Scripts

There are 3 scripts I use together for dev (each in their own console): 'watch', 'serve' and 'test'.

'npm run watch' will look for Typescript changes and compile it to es6.
'npm run serve' will load a local server with './index-es6.html' as entry point. It uses './script.js' as module loader.
'npm run test -- --watch --coverage --silent' will run jest tests on each typescript change.

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

The Problem

Install

What can I do?

Basic usage

Typescript

Javascript (es6 module)

index.html

main.js

Javascript (es5)

index.html

main.js

API and Documentation

Use cases

Full options example

Use with JEST as test runner.

License

Development

Scripts

ToDo

Pull requests are welcome

Find me 🏃‍