colory-logger

✨ Features

• 🎨 Cross-Environment: ANSI colors in Node.js terminals & %c CSS colors in Browser DevTools.
• 📍 Clickable File Paths: Automatically detects caller file:line:col for instant Ctrl+Click jumping in VS Code.
• ⚡ Single Clean API: Simple log(message, type) design.
• 🚨 First-Class Error Support: Pass Error objects directly (log(err, "error")) to log stack traces cleanly.
• 🎛️ Severity Level Filtering: Mute lower-severity logs globally (e.g. configure({ level: "warning" })).
• ⚡ Zero Dependencies: Lightweight, fast, and tree-shakeable.
• 🌐 Next.js & React Ready: Works seamlessly in both Server Components (SSR) and Client Components.

📦 Installation

npm install colory-logger

or with yarn / pnpm / bun:

yarn add colory-logger
pnpm add colory-logger
bun add colory-logger

🚀 Quick Start

import { log } from "colory-logger";

// Log with different severities (default is "info")
log("User registered successfully", "success");  // ✔ SUCCESS  src/auth.ts:14:1  User registered successfully
log("DB connection timeout", "error");           // ✖ ERROR    src/db.ts:42:1    DB connection timeout
log("API response time > 500ms", "warning");     // ⚠ WARNING  src/api.ts:8:1    API response time > 500ms
log("Server running on port 3000", "info");      // ℹ INFO     src/index.ts:2:1  Server running on port 3000
log("Starting background worker");               // ℹ INFO     src/index.ts:5:1  Starting background worker

CommonJS (Node.js)

const { log } = require("colory-logger");

log("Server started", "success");

🛠️ Features & Usage

1. Passing Error Objects

Pass Error instances directly to print formatted error messages and stack traces:

try {
  JSON.parse("invalid json");
} catch (err) {
  log(err, "error");
}
// Output:
// ✖ ERROR  src/parser.ts:5:1
//   SyntaxError: Unexpected token 'i', "invalid json" is not valid JSON
//       at JSON.parse (<anonymous>)
//       at parseData (src/parser.ts:3:8)

2. Global Configuration configure()

Call configure() once at the entry point of your app to customize logging behavior:

import { configure } from "colory-logger";

configure({
  showPath: false,      // Hide caller file path (useful in production)
  colorsEnabled: false, // Strip ANSI/CSS colors (useful in plain text CI logs)
  level: "warning",     // Severity filter: only logs >= warning will print
});

Severity Hierarchy (level option):

| Level | Printable Types | | :--- | :--- | | "success" | success, info, warning, error (All logs) | | "info" | info, warning, error | | "warning" | warning, error | | "error" | error only |

⚛️ React & Next.js Examples

React Component

import React from "react";
import { log } from "colory-logger";

export function SaveButton() {
  const handleSave = async () => {
    try {
      await api.saveData();
      log("Data saved successfully!", "success");
    } catch (err) {
      log(err, "error");
    }
  };

  return <button onClick={handleSave}>Save</button>;
}

Next.js (Server & Client Components)

// Server Component / API Route (Node.js ANSI Terminal)
import { log } from "colory-logger";

export async function GET() {
  log("Fetching user profile", "info");
  return Response.json({ status: "ok" });
}

// Client Component (Browser %c CSS DevTools)
"use client";
import { log } from "colory-logger";
import { useEffect } from "react";

export default function UserProfile() {
  useEffect(() => {
    log("Component mounted", "info");
  }, []);

  return <div>Profile Page</div>;
}

🛠️ Development & Testing

Run local tests:

npm run build
node test/test.js

Run the React demo:

cd react-demo
npm run dev

📄 License

MIT