achorn

Achorn is a colorful, good-looking, fully customizable logging utility for the Browser. It is heavily inspired by @klaussinanis Signale logger for Node.js backend applications.

Core Features

• Fully customizable
• No dependencies
• Webpack Support (for Angular, React, ...)
• Written and strongly typed in TypeScript
• Easy to use Timers, e.g. for HTTP requests
• ... you can even add your own loggers/prefixes!

But does it work in...?

Latest ✔	Latest ✔	10+ ✔	Latest ✔	6.1+ ✔

How to Install

NPM

npm install achorn

Yarn

yarn add achorn

CDN

<!-- unpkg -->
<script src="https://unpkg.com/achorn/lib/achorn.js"></script>

<!-- jsdelivr -->
<script src="https://cdn.jsdelivr.net/npm/achorn/lib/achorn.js"></script>

How to Use

The first thing after importing Achorn is creating a new Achorn() instance:

// Without config
const achorn = new Achorn();

// With custom config
const achorn = new Achorn({
    showTimestamp: true,
    globalPrefix: [...]
});

Achorn takes an optional Config object as input. For all config options, see the config interface file.

After the initial setup, you can already use any of Achorns default loggers, which are defined in their dedicated prefixes file. Optionally, you can add your own prefixes/loggers by providing them in the prefixes field in the Config.

Timers

The most common use for Timers in Achorn are probably HTTP requests. Here's an example implementation:

// Create new Timer called "Async"
const timer = achorn.timer("Async");

// Make request
request("https://google.com")
    .then((res) => {
        // End timer with success message
        timer.success("Request successful! 🎉", res);
    })
    .catch((err) => {
        // End timer with error message
        timer.error("Request failed.", err);
    });

Local Development

After cloning the repository, all you have to do is run npm run watch to start Webpack in watch mode, which will listen for file changes and rebuild Achorn accordingly.

Then, simply open the index.html of this project in the browser!