This is a toy, it is an enhanced version of console.log

Overview

uu-console

npm npm npm bundle size GitHub last commit

Hi, this is a toy. When you use console.log to print some logs, this can help you do some useless things.

What is uu-console

  • Support built-in multiple theme color cards to display different print log background theme colors.
  • Support built-in multiple sizes, display different print log font sizes.
  • Support custom sizes and themes.
  • Compactly, core library only 8K.

Features

  • Multiple theme
  • Custom theme
  • Theme sort
  • Multiple size
  • Custom size
  • Multiple uuConsole instance

Brower Support

Chrome Firefox Safari Opera Edge IE
Latest Latest Latest Latest Latest 11

Installing

Using npm:

$ npm install uu-console

Using yarn:

$ yarn add uu-console

Using pnpm:

$ pnpm add uu-console

Using jsDelivr CDN:

<script src="https://cdn.jsdelivr.net/npm/uu-console/dist/uu-console.umd.js"></script>

Using unpkg CDN:

<script src="https://unpkg.com/uu-console/dist/uu-console.umd.js"></script>

Examples

in umd html

uuConsole.log('Hello', 'This is', 'uu-console');

// or
uuConsole.log(['Hello', 'This is', 'uu-console']);

in esm project

import uuConsole from 'uu-console';

uuConsole.log('Hello', 'uu-console');

load other theme and install.

// By default, only one theme 'No301' is included, and other themes need to be manually imported.
import uuThemes from 'uu-console/theme/theme.esm.js';

// Install other themes, so you can use other themes, like `No601`、`No304`...
uuConsole.installTheme(uuThemes.No601, uuThemes.No304);

uuConsole.useTheme('No601').log('Hi', 'UU');

load other size and install.

// By default, only one size 'mini' is included, and other sizes need to be manually imported.
import uuSizes from 'uu-console/size/size.esm.js';

// Install other sizes, so you can use other sizes, like `micro`、 `big`....
uuConsole.installSize(uuSizes.micro, uuSize.big);

uuConsole.useSize('micro').log('Hi', 'UU');

API

log(infos)

To print log infos.

  // use string.
  uuConsole.log('Hi', 'UU')

  // use string array.
  uuConsole.log(['Hi', 'UU'])

  // use object and differences size and theme, remember install the size and theme before using.
  uuConsole.log(
    { text: 'Hi', size: 'small', theme: 'No501' },
    { text: 'UU', size: 'medium', theme: 'No304'},
    'Console',
    ...
  )

  // use array object and custom style, and style support object and string
  uuConsole.log(
    [
      { text: 'Hi', size: 'micro', theme: 'No201' },
      'Boy',
      { text: 'This is UU', style: 'color: green; background: pink' },
      { text: 'Console', style: { fontSize: '20px', color: 'fuchsia' } }
    ]
  )

useTheme(name)

Use built in themes, the built in theme name is range from No101-No106No201-No206No301-No306No401-No406No501-No506No601-No606No701-No706No801-No806No901-No902 and Nox01, total 55 themes!

And default theme is No301, if you like others themes, please import and install them before using.

Note that the theme is global configuration, which can take effect once set.

// use `No101` theme.
uuConsole.useTheme('No101').log('Hi', 'UU', 'Console');

and here are the total themes.

No101-106 No201-206 No301-306 No401-406 No501-506 No601-606 No701-706 No801-806 No901-906 and Nox01

useThemeOnce(name)

Use built in theme, but effective only once.

// use `No101` theme once
uuConsole.useThemeOnce('No101').log('Hi', 'UU', 'Console');

useThemeSort([0, 1, 2])

Sort the built in theme card position. And the default value is [0, 1, 2]. Note that the themeSort is global configuration, which can take effect once use.

// use theme sort before
uuConsole.useTheme('No302').log('Hi', 'UU', 'Before');

// use theme sort to [1, 2, 0]
uuConsole.useThemeSort([1, 2, 0]).log('Hi', 'UU', 'After');

themeSort

useThemeSortOnce([0, 1, 2])

Sort the built in theme, but only effective once. And the default value is null.

// use theme sort to [1, 2, 0] once
uuConsole.useThemeSortOnce([1, 2, 0]).log('Hi', 'UU', 'Console');

setCustomTheme(name, theme)

If the built-in theme is not to your liking, you can customize the theme and use it. And theme cannot be set repeat registration.

const themeProps = [
  {
    color: '#fff',
    background: '#ff00ee',
    fontWeight: 'bold',
  },
  {
    color: '#555',
    background: '#dd33aa',
    fontStyle: 'italic',
    letterSpacing: '5px',
  },
  'color: #ff00cc; background: #111;',
];

uuConsole.setCustomTheme('my-theme', themeProps).useTheme('my-theme');
uuConsole.useSize('medium').log('Hello', 'B-O-Y,', 'Where are you from');

deleteCustomTheme(name)

Only custom theme can be deleted.

// No101 is not custom, cannot be deleted!
uuConsole.deleteCustomTheme('No101');

// Only custom theme can be deleted.
uuConsole.setCustomTheme('my-theme', []);
uuConsole.deleteCustomTheme('my-theme');

installTheme(theme1, [theme2, theme3...])

Install other built-in themes.

import uuThemes from 'uu-console/dist/theme/theme.esm.js';

// install all themes.
uuConsole.installTheme(uuConsole.toAry(uuThemes));

// or just install part of themes. Notice theme No301 is default theme, not in uuThemes.
const { No404, No806 } = uuThemes;
uuConsole.installTheme(No404, No806);

useSize(name)

Use built in sizes, the built in size name contains microtinyminismallmediumbiglargehuge, total 8 sizes!

And default size is mini, if you like other sizes, please import and install theme before using.

Note that the size is global configuration, which can take effect once use.

// use `medium` size.
uuConsole.useSize('medium').log('Hi', 'UU', 'Console');

size1 size2

useSizeOnce(name)

Use built in sizes, but effective only once

// use `medium` size just once.
uuConsole.useSizeOnce('medium').log('Hi', 'UU', 'Console');

useSizeSort([0, 1, 2])

Sort the custom size position, and the default value is [0, 1, 2]. When set custom size and use the size, please reset the custom size number equal to the sizeSort, otherwise the size style will not effective. Note that the sizeSort is global configuration, which can take effect once use.

// use theme sort to [1, 2, 0].
uuConsole.useThemeSort([1, 2, 0]).log('Hi', 'UU', 'After');

useSizeSortOnce([0, 1, 2])

Sort size, but only effective once. And the default value is null.

// use size sort to [1, 2, 0] once.
uuConsole.useSizeSortOnce([1, 2, 0]).log('Hi', 'UU', 'Console');

setCustomSize(name, size)

If the built-in size is not to your liking, you can customize the size and use it. And size cannot be set repeat registration.

const sizeProps = [
  {
    fontSize: '14px',
    padding: '5px 10px',
    display: 'inline-block', // for firefox
  },
  'font-size: 20px; padding: 10px; dispaly: inline-block;',
];

// set custom size and use it.
uuConsole
  .setCustomSize('my-size', sizeProps)
  .useSize('my-size')
  .useTheme('No301')
  .log('Hello', 'Is UUConsole?');

deleteCustomSize(size)

Only custom size can be deleted.

// micro is not custom, cannot be deleted!
uuConsole.deleteCustomSize('micro');

// Only custom size can be deleted.
uuConsole.setCustomSize('my-size', []);
uuConsole.deleteCustomSize('my-size');

installSize(size1, [size2, size3...])

Install other built-in sizes.

import uuSizes from 'uu-console/dist/size/size.esm.js';

// install all sizes.
uuConsole.installSize(uuConsole.toAry(uuSizes));

// or just install part of sizes. Notice size mini is default size, not in uuSizes.
const { micro, medium } = uuSizes;
uuConsole.installTheme(micro, medium);

create()

Generate initial uu-console instance, so you can set different theme and size in the same time.

const uu2 = uuConsole.create();
uu2.log('Hello', 'UU-Console');

clone()

Clone current uu-console instance, so you can set different theme and size in the same time.

const uu2 = uuConsole.clone();
uu2.useTheme('No606').useSize('mini').log('Clone', 'UU');

toAry(Object)

Transform object's value to array

const ary = uuConsole.toAry({ a: 1, b: 2 });
// ary = [1, 2]
You might also like...

Enhanced interval features for Node.js, such as promisified interval and human readable time parsing.

Interval-next Interval-next is a package that extends Javascript's built-in setInterval() capabilities. You have a plain and promisified interval meth

Jul 28, 2022

An enhanced HTML 5 file input for Bootstrap 5.x/4.x./3.x with file preview, multiple selection, and more features.

An enhanced HTML 5 file input for Bootstrap 5.x/4.x./3.x with file preview, multiple selection, and more features.

bootstrap-fileinput An enhanced HTML 5 file input for Bootstrap 5.x, 4.x, and 3.x with file preview for various files, offers multiple selection, resu

Jan 3, 2023

Simple click-triggered navigation submenus. Accessible and progressively enhanced.

Clicky Menus! A project by Mark Root-Wiley, MRW Web Design Clicky Menus lets you create a progressively-enhanced, accessible one-level dropdown menu t

Dec 6, 2022

The classical game of Liar's Dice enhanced with the usage of Zero-Knowledge Proof

Liar's Dice An online multiplayer game showcasing the potential of Aleo's Zero Knowledge Proof platform. Local deployment Prerequisites Setup dnsmasq

Dec 15, 2022

The classical game of Liar's Dice enhanced with the usage of Zero-Knowledge Proof

Liar's Dice An online multiplayer game showcasing the potential of Aleo's Zero Knowledge Proof platform. Local deployment Prerequisites Setup dnsmasq

Oct 20, 2022

A progressively enhanced server-rendered form-aware web component counter using WebC

Eleventy WebC Number Counter Demo A progressively enhanced server-rendered form-aware web component counter using WebC. This enhances from an input t

Nov 11, 2022

This is a full stack application where you can log all you places where you visited....-

This is a full stack application where you can log all you places where you visited....-

Full Stack Travelling Log 🌍 🎡 ✈️ This is a full stack application where you can log ✈️ your all places 🗽 🗼 🚲 you have visited .... 🗺️ 🗺️ 🗺️ Se

Sep 29, 2022

Chrome extension that uses vulnerabilities CVE-2021-33044 and CVE-2021-33045 to log in to Dahua cameras without authentication.

Chrome extension that uses vulnerabilities CVE-2021-33044 and CVE-2021-33045 to log in to Dahua cameras without authentication.

DahuaLoginBypass Chrome extension that uses vulnerability CVE-2021-33044 to log in to Dahua IP cameras and VTH/VTO (video intercom) devices without au

Nov 26, 2022

Get the last logs of your /var/log folder

var-log-crawler Get the last logs of your /var/log folder Requirements: Node installed. Hot to use: Rename .env.sample to .env and fill with your valu

Jan 5, 2022
Owner
KK Liu
http://preetyname.com
KK Liu
Another logger in JS. This one offers a console.log-like API and formatting, colored lines and timestamps (or not if desired), all that with 0 dependencies.

hellog Your new logger ! hellog is a general-purpose logging library. It offers a console.log-like API and formatting, extensible type-safety colored

Maxence Lecanu 4 Jan 5, 2022
Style templates for console.log

sttyl Style templates for console.log. Usage This module is primarily intended for Deno and browsers. import { sttyl } from "https://deno.land/x/sttyl

Wayne Bloss 8 Dec 27, 2022
A little toy password manager made for a university class

Eddy Passbear's Password Manager A little toy password manager made for a university class. Powered by Remix, Prisma and the air we breathe. Step-by-s

Kacper Seredyn 2 Jan 30, 2022
A little toy app to help you find the nearest match for a given color within a Figma Tokens color palette.

Hey Palette So you've got a color palette in Figma and you've used the Figma Tokens plugin to export that palette to JSON. Let's say you have a color

Kalo Pilato 5 Nov 15, 2022
a toy project to explore Stable Diffusion locally through a nodeJS server.

SD-explorer foreword this is a toy project to run the Stable Diffusion model locally. if you're after something more solid, I'd suggest you use WebUI

nicolas barradeau 18 Dec 18, 2022
The Remix version of the fakebooks app demonstrated on https://remix.run. Check out the CRA version: https://github.com/kentcdodds/fakebooks-cra

Remix Fakebooks App This is a (very) simple implementation of the fakebooks mock app demonstrated on remix.run. There is no database, but there is an

Kent C. Dodds 61 Dec 22, 2022
A Drag-and-Drop library for all JavaScript frameworks implementing an enhanced transformation mechanism to manipulate DOM elements

JavaScript Project to Manipulate DOM Elements DFlex A Drag-and-Drop library for all JavaScript frameworks implementing an enhanced transformation mech

DFlex 1.5k Jan 8, 2023
A web component for progressively-enhanced auto-expanding textareas

Elastic Textarea A web component for progressively-enhanced auto-expanding textareas. This web component progressively enhances the native textarea: a

Cloud Four 29 Jan 9, 2023
Enhanced Sanity.io plugin development experience.

@sanity/plugin-kit NOTE This is a developer preview package meant for Sanity Studio v3 plugin development. For a v2 alternative, consider using Sanipa

Sanity 40 Dec 27, 2022
An enhanced VSCode extension for the Move programming language.

Move Analyzer Plus Provides language support for the Move programming language. Install on the VSCode Extension Marketplace: Move Analyzer Plus on the

The Moving Company 10 Aug 12, 2022