Never Pummel Muskoxen

    tiza
    TypeScript icon, indicating that this package has built-in type declarations

    2.2.1 • Public • Published

    Tiza

    demo

    build coverage npm gzip size

    Tiza is a JavaScript library for browsers' console styling.

    View demo here: https://tiza.js.org

    Installation

    NPM

    npm install --save tiza

    Then import it:

    import tiza from 'tiza'
    // or via require if you are using commonjs
    const tiza = require('tiza').default

    UMD bundle

    Add script tag to your HTML file:

    <script src="https://unpkg.com/tiza/dist/tiza.min.js"></script>

    Usage

    import tiza from 'tiza'
     
    tiza
      .color('#fff') // Set color, all CSS colors are supported
      .bgColor('purple') // Set background color
      .bold() // Set bold font
      .italic() // Set italic font
      .size(20) // Set font size
     
      // Support custom styles too!
      .style(`padding: 4px; border-radius: 2px;`)
     
      // After styles done right, it's time to add text now
      .text('Hey, I have styling now!')
     
      .space(8) // Add spaces
      .text('Hey, I am far away from previous one')
     
      .newline(2) // Add newline
     
      .reset() // Reset all styles set before
     
      .text('I lost my styles, because `reset` is called')
     
      .log() // log all texts above to console

    Always remember to call log method at last.

    Styles reusing

    To reuse styles, just make them nested like this:

    const error = tiza.color('red').text
    const info = tiza.bold().bgColor('yellow').text
     
    tiza.log(
      error('I am some error'),
      'I am some normal message',
      error('I am some error again!'),
      info('I am some info', error('I am still some error!')),
    )

    Notice that inside texts will not extend outside texts' styles.

    For more detail see API

    How does it work?

    https://developers.google.com/web/tools/chrome-devtools/console/console-write

    Find Styling console output with CSS

    Who's using Tiza

    Console Importer

    API

    Method Description
    tiza.color('#f00') Set font color, support all CSS colors
    tiza.bgColor('#f00') Set background color, support all CSS colors
    tiza.bold() Set font weight to bold
    tiza.italic() Set font style to italic
    tiza.size(14) Set font size, number will be converted to px
    tiza.style('color:#f00') Set custom style, using inline style format
    tiza.reset() Reset styles set before
    tiza.text(...args: string[]) Add text(s), support multiple arguments. Every text added here will be styled with styles set previously. Notice that every argument will be converted to string, and there will be no space between them(This behaviour is different with console.log). If you want to add a space, use text('a').space().text('b')
    tiza.space(count?: number) Add space. The default count is 1
    tiza.newline(count?: number) Add newline. The default count is 1
    tiza.log() Log all texts to console with console.log. Always remember to call log at last. Arguments are also supported, log(...args) equals to text(...args).log()
    tiza.info() The same as tiza.log, but output with console.info
    tiza.warn() The same as tiza.log, but output with console.warn
    tiza.error() The same as tiza.log, but output with console.error

    License

    MIT

    Install

    npm i tiza

    DownloadsWeekly Downloads

    38

    Version

    2.2.1

    License

    MIT

    Unpacked Size

    43.8 kB

    Total Files

    13

    Last publish

    Collaborators

    • pd4d10