ansis 다운로드 - ansis 소스 코드 다운로드

ANSI 스타일

터미널 출력에 ANSI 색상 및 스타일을 적용하기위한 작고 빠른 Node.js 라이브러리.
ANSIS는 필요한 모든 기능을 제공하며 유사한 라이브러리와 비교할 수 있습니다.
ANSIS는 분필 과 피코 콜러 (일부 사용 사례)보다 빠릅니다. 벤치 마크를 참조하십시오.

ANSIS로 전환하는 이유를 설치하고 빠르게 시작하십시오

용법

 import ansis , { red , green , cyan , black , ansi256 , hex } from 'ansis' ;

ansis . blueBright ( 'file.txt' )
green `Succeful!`
red `Error: ${ cyan ( file ) } not found!`
black . bgYellow `Warning!`
ansi256 ( 214 ) `Orange`
hex ( '#E0115F' ) . bold . underline ( 'Truecolor!' )

⚖️ 유사한 라이브러리

ANSIS와 유사한 가장 인기있는 node.js 라이브러리 :

분필, 피코 콜러, 컬러, 클리르, 안시 색상, 콜로리스트, 클리 컬러, 색상 클리, 색상 .js

✅ 기능을 비교 하시겠습니까? 패키지 크기 벤치 마크를 비교하십시오

하이라이트

ESM , CommonJS , TypeScript를 지원합니다
Bun , Deno , Next.js Runtimes를 지원합니다
chalk colorette picocolors ansi-colors 의 드롭 인 교체
기본값 및 명명 된 import ansis, { red, bold, ansi256, hex } from 'ansis'
체인 구문 red.bold.underline('text')
중첩 된 템플릿 문자열 red`Error: ${blue`file.js`} not found!`
ANSI 스타일은 bold italic underline ~~strikethrough~~ dim
ansi 16 색 red`Error!` redBright`Error!` bgRed`Error!` bgRedBright`Error!`
ANSI 256 Colors fg(56)`violet` bg(208)`orange`
truecolor ( RGB , 16 진 ) rgb(224, 17, 95)`Ruby` hex('#96C')`Amethyst`
지원되는 색상 공간으로의 폴백 : truecolor → 256 색상 → 16 색 → 색상 없음
Truecolor 라는 이름의 기본 색상을 확장합니다
RAW ANSI 코드 open 및 close 속성 `foo ${red.open}red{red.close} bar`
스트립 Ansi 코드 메소드 ansis.strip()
광범위한 환경에서 색상 지원을 자동으로 감지합니다.
환경 변수를 지원합니다 NO_COLOR FORCE_COLOR 및 플래그 --no-color --color
16, 256 또는 True Color로 응용 프로그램을 테스트하도록 Colorterm 변수 설정
문자열에서 n 사용할 때 end of line 에서 올바른 스타일 브레이크
String.prototype 를 확장하지 않습니다
제로 의존성
테스트 적용 범위 100%. 장기 유지 보수.

? 사용

Nestjs, Facebook/Stylex, 속편, Salesforce, Oclif, WebPackbar

westion / 기능 요청 / 버그

버그를 발견했거나 기능 제안이 있다면 Github에서 문제를 해결하십시오.

Ansis로 전환하는 이유

오늘날 가장 작고 가장 빠른 두 라이브러리는 ansis 와 picocolors 입니다. 둘 다 ES 툴링 커뮤니티에서 구형, 부피가 큰 라이브러리를위한 최고의 교체품으로 권장합니다.

? 포장되지 않은 크기

picocolors : 6.4 KB- 기본 기능 만있는 마이크로 라이브러리.
аnsis : 7.4 KB- 필요한 모든 기능을 포함하는 강력한 라이브러리.
chalk : 44.2 KB- ANSIS와 유사한 기능을 제공하지만 더 큽니다.

⚡ 성능

picocolors : 단일 스타일을 적용 할 때 가장 빠릅니다 (예 : red 만).
аnsis : 두 가지 이상의 스타일 (예 : red + bgWhite )을 적용 할 때 가장 빠릅니다.
chalk : 모든 사용 사례에서 ANSIS 및 PICOCOLORS 보다 느리게.

? 유지

다른 많은 라이브러리와 달리 ansis , chalk 및 picocolors 만 적극적으로 유지 관리됩니다.

colorette : 2 년 전에 마지막으로 업데이트되었습니다
ansi-colors : 3 년 전에 마지막으로 업데이트되었습니다
kleur : 2 년 전에 마지막으로 업데이트되었습니다
cli-color : 마지막 업데이트 ~ 1 년 전에
colors-cli : 1 년 전에 마지막으로 업데이트되었습니다
colors.js : 5 년 전에 마지막으로 업데이트되었습니다

? 어느 것을 사용해야합니까?

red('foo') 와 같은 단일 스타일 만 사용하는 경우 Picocolors가 최상의 솔루션입니다.
그러나 여러 스타일 (예 : red + bold + bgWhite )과 같은 더 많은 것이 필요한 경우
ANSI256 색상, 트루 콜러 또는 광범위한 환경에 대한 지원을 받으면 ANSIS가 더 나은 선택입니다.

유사한 라이브러리와 비교하여 기능, 패키지 크기 및 벤치 마크 목록을 탐색하십시오.

팁

ansis 및 chalk 와 같은 라이브러리가 제공하는 체인 구문을 사용하십시오.
중첩 된 통화는 체인 구문보다 훨씬 느리고 읽기 쉬운 것을 피하십시오.
코드를 깨끗하고 읽을 수 있도록하십시오!

 red . bold . bgWhite `Error`                    ✅ ansis: faster , shorter , readable
pico . red ( pico . bold ( pico . bgWhite ( 'Error' ) ) )  picocolor: slower , longer , unreadable

red `Error: ${ cyan . underline ( file ) } not found!`                   ✅ ansis ?
pico . red ( `Error: ${ pico . cyan ( pico . underline ( file ) ) } not found!` )  picocolor ?

ANSIS로 전환하는 방법

chalk 교체
colorette 교체
picocolors 교체
ansi-colors 교체
kleur 교체
cli-color 교체

↑ 상단

설치 및 빠른 시작

npm install ansis

ESM 또는 CommonJS 구문으로 기본 모듈 또는 명명 된 색상을 가져올 수 있습니다.

 // ESM default import
import ansis from 'ansis' ;
// ESM named import
import { red , green , blue } from 'ansis' ;

또는

 // CommonJS default import
const ansis = require ( 'ansis' ) ;
// CommonJS named import
const { red , green , blue } = require ( 'ansis' ) ;

ANSI 색상 및 스타일 목록을 참조하십시오.

 console . log ( ansis . green ( 'Success!' ) ) ;
console . log ( green ( 'Success!' ) ) ;

// template string
console . log ( green `Success!` ) ;

// chained syntax
console . log ( green . bold `Success!` ) ;

// nested syntax
console . log ( red `The ${ blue . underline `file.js` } not found!` ) ;

기본적인 예 Hello World! :

 import { red , black , inverse , reset } from 'ansis' ;

console . log ( green `Hello ${ inverse `ANSI` } World!
${ black . bgYellow `Warning:` } ${ cyan `/path/to/file.js` } ${ red `not found!` } ` ) ;

산출:
스크린 샷 "안녕하세요 Ansi World!"

↑ 상단

import

ansis default import 와 named import 모두 지원합니다.

 // default import
import ansis from 'ansis' ;

ansis . red . bold ( 'text' ) ;

이름이 지정된 색상, 스타일 및 기능을 가져올 수 있습니다. 수입 된 모든 색상과 스타일은 chainable 합니다.

 // named import
import { red , hex , italic } from 'ansis' ;

red . bold ( 'text' ) ;

기본 가져 오기 및 명명 된 가져 오기를 결합 할 수 있습니다.

 // default and named import
import ansis , { red } from 'ansis' ;

const redText = red ( 'text' ) ; // colorized ANSI string
const text = ansis . strip ( redText ) ; // pure string without ANSI codes

템플릿 리터럴

ansis 함수 구문 red('error') 과 템플릿 리터럴 red`error` 모두 지원합니다.

template literals 사용하면 복잡한 템플릿을 더 읽기 쉽고 짧게 만들 수 있습니다.
function syntax 사용하여 변수를 채색 할 수 있습니다.

 import { red } from 'ansis' ;

let message = 'error' ;

red ( message ) ;
red `text` ;
red `text ${ message } text` ;

체인 된 구문

모든 색상, 스타일 및 기능은 체인 가능합니다. 각 색상이나 스타일은 순서대로 결합 할 수 있습니다.

 import { red , bold , italic , hex } from 'ansis' ;

red . bold `text` ;
hex ( '#FF75D1' ) . bgCyan . bold `text` ;
bold . bgHex ( '#FF75D1' ) . cyan `text` ;
italic . bold . yellow . bgMagentaBright `text` ;

↑ 상단

중첩 된 구문

기능과 템플릿 문자열을 서로 둥지를 틀 수 있습니다. 다른 라이브러리 (Chalk, Kleur, Colorette, Colors.js 등)는 중첩 된 템플릿 문자열을 지원하지 않습니다.

중첩 템플릿 문자열 :

 import { red , green } from 'ansis' ;

red `red ${ green `green` } red` ;

깊은 중첩 체인 스타일 :

 import { red , green , cyan , magenta , yellow , italic , underline } from 'ansis' ;

red ( `red ${ italic ( `red italic ${ underline ( `red italic underline` ) } ` ) } red` ) ;

// deep nested chained styles
green (
  `green ${ yellow (
    `yellow ${ magenta (
      `magenta ${ cyan (
        `cyan ${ red . italic . underline `red italic underline` } cyan` ,
      ) } magenta` ,
    ) } yellow` ,
  ) } green` ,
) ;

산출:
스크린 샷 중첩 스타일

멀티 라인 중첩 템플릿 문자열 :

 import { red , green , hex , visible , inverse } from 'ansis' ;

// defined a Truecolor as the constant
const orange = hex ( '#FFAB40' ) ;

let cpu = 33 ;
let ram = 44 ;
let disk = 55 ;

// normal colors
visible `
CPU:  ${ red ` ${ cpu } %` }
RAM:  ${ green ` ${ ram } %` }
DISK: ${ orange ` ${ disk } %` }
` ;

// inversed colors
inverse `
CPU:  ${ red ` ${ cpu } %` }
RAM:  ${ green ` ${ ram } %` }
DISK: ${ orange ` ${ disk } %` }
` ;

산출:
스크린 샷 멀티 라인 중첩

↑ 상단

기본 ANSI 16 색상 및 스타일

색상과 스타일은 분필, 컬러, 피코 콜러, kleur와 같은 많은 인기있는 라이브러리에서 사용하는 표준 이름을 가지고 있습니다.

전경 색상	배경색	스타일
`black`	`bgBlack`	`dim`
`red`	`bgRed`	`bold`
`green`	`bgGreen`	`italic`
`yellow`	`bgYellow`	`underline`
`blue`	`bgBlue`	~~`strikethrough`~~ (별명 `strike` )
`magenta`	`bgMagenta`	`inverse`
`cyan`	`bgCyan`	`visible`
`white`	`bgWhite`	`hidden`
`blackBright` 별칭 : `grey` `gray` 미국 철자	`bgBlackBright` 별칭 : `bgGrey` `bgGray` 우리 철자	`reset`
`redBright`	`bgRedBright`
`greenBright`	`bgGreenBright`
`yellowBright`	`bgYellowBright`
`blueBright`	`bgBlueBright`
`magentaBright`	`bgMagentaBright`
`cyanBright`	`bgCyanBright`
`whiteBright`	`bgWhiteBright`

기본 색상을 확장합니다

기본값, 가져온 ansis 인스턴스에는 기본 스타일과 색상이 포함되어 있습니다. truecolor의 사용자 정의 색상 이름으로 기본 색상을 확장하려면 ansis.extend() 메소드를 사용하십시오.

 import ansis from 'ansis' ;

// extend base colors
ansis . extend ( {
  pink : '#FF75D1' ,
  orange : '#FFAB40' ,
} ) ;

// the custom colors are available under namespace `ansis`
ansis . pink ( 'text' ) ;
ansis . orange ( 'text' ) ;

TypeScript가있는 사용 예 :

 import ansis , { AnsiColorsExtend } from 'ansis' ;

// extend base colors
ansis . extend ( {
  pink : '#FF75D1' ,
  orange : '#FFAB40' ,
} ) ;

const write = ( style : AnsiColorsExtend < 'pink' | 'orange' > , message : string ) => {
  console . log ( ansis [ style ] ( message ) ) ;
}

write ( 'red' , 'message' ) ; // base color OK
write ( 'pink' , 'message' ) ; // extended color OK
write ( 'orange' , 'message' ) ; // extended color OK
write ( 'unknown' , 'message' ) ; // TypeScript Error

↑ 상단

ANSI 256 색상

사전 정의 된 256 개의 색상 세트.

코드 범위	설명
0-7	표준 색상
8-15	밝은 색상
16-231	6 × 6 × 6 큐브 (216 색)
232-255	24 단계로 검은 색에서 흰색으로 그레이 스케일

전경 기능 : ansi256(code) 짧은 별칭 fg(code) 가 있습니다.
배경 기능 : bgAnsi256(code) 짧은 별칭 bg(code) 가 있습니다.

ansi256() 및 bgAnsi256() 방법은 chalk API와의 호환성을 위해 구현됩니다.

ANSI 색상 코드를 참조하십시오.

폴백

터미널이 16 가지 색상 만 지원하면 ANSI 256 색상이 16 가지 색상으로 보간됩니다.

사용 예제

 import { bold , ansi256 , fg , bgAnsi256 , bg } from 'ansis' ;

// foreground color
ansi256 ( 96 ) `Bright Cyan` ;
fg ( 96 ) `Bright Cyan` ; // alias for ansi256

// background color
bgAnsi256 ( 105 ) `Bright Magenta` ;
bg ( 105 ) `Bright Magenta` ; // alias for bgAnsi256

// function is chainable
ansi256 ( 96 ) . bold `bold Bright Cyan` ;

// function is avaliable in each style
bold . ansi256 ( 96 ) . underline `bold underline Bright Cyan` ;

// you can combine the functions and styles in any order
bgAnsi256 ( 105 ) . ansi256 ( 96 ) `cyan text on magenta background`
bg ( 105 ) . fg ( 96 ) `cyan text on magenta background`

truecolor

hex 또는 rgb 형식을 사용할 수 있습니다.

전경 기능 : hex() rgb()
배경 기능 : bgHex() bgRgb()

 import { bold , hex , rgb , bgHex , bgRgb } from 'ansis' ;

// foreground color
hex ( '#E0115F' ) . bold `bold Ruby` ;
hex ( '#96C' ) `Amethyst` ;
rgb ( 224 , 17 , 95 ) . italic `italic Ruby` ;

// background color
bgHex ( '#E0115F' ) `Ruby` ;
bgHex ( '#96C' ) `Amethyst` ;
bgRgb ( 224 , 17 , 95 ) `Ruby` ;

// you can combine the functions and styles in any order
bold . hex ( '#E0115F' ) . bgHex ( '#96C' ) `ruby bold text on amethyst background`

↑ 상단

폴백

ansis 지원되는 색상 공간으로의 폴백을 지원합니다.

 Truecolor —> 256 colors —> 16 colors —> no colors (black & white)

hex() , rgb() 또는 ansis256() 함수를 사용하면 지원되는 TrueColor 또는 256 색상의 단자에서 색상이 보간됩니다.

output

↑ 상단

ANSI 코드를 사용하십시오

각 스타일에 대해 open 및 close 속성으로 ANSI 탈출 코드를 사용할 수 있습니다.

 import { red , bold } from 'ansis' ;

// each style has `open` and `close` properties
console . log ( `Hello ${ red . open } ANSI ${ red . close } World!` ) ;

// you can defiene own style which will have the `open` and `close` properties
const myStyle = bold . italic . black . bgHex ( '#E0115F' ) ;

console . log ( `Hello ${ myStyle . open } ANSI ${ myStyle . close } World!` ) ;

ANSI 코드를 스트립하십시오

ANSIS 클래스에는 문자열에서 모든 ANSI 코드를 제거하는 메소드 strip() 포함되어 있습니다.

 import ansis from 'ansis' ;

const ansiString = ansis . green `Hello World!` ;
const string = ansis . strip ( ansiString ) ;

변수 string 에는 ANSI 코드가없는 순수한 문자열이 포함됩니다.

↑ 상단

새로운 라인

end of line 에서 올바른 스타일 브레이크를 지원합니다.

 import { bgGreen } from 'ansis' ;

console . log ( bgGreen `nAnsisnNew LinenNext New Linen` ) ;

output

바로 가기 / 테마

자신의 테마 정의 :

 import ansis from 'ansis' ;

const theme = {
  info : ansis . cyan . italic ,
  warn : ansis . black . bgYellowBright ,
  error : ansis . red . bold ,
  ruby : ansis . hex ( '#E0115F' ) ,
} ;

theme . info ( 'info' ) ;
theme . warn ( 'warning' ) ;
theme . error ( 'error' ) ;
theme . ruby ( 'Ruby color' ) ;

↑ 상단

CLI 환경 변수

기본값, 터미널 콘솔의 출력은 색상이 밝혀지고 파일의 출력은 채색되지 않습니다.

유색 출력 사용 환경 변수 NO_COLOR 및 FORCE_COLOR 강제로 사용합니다.

NO_COLOR 변수는 빈 값이없는 선물이어야합니다. 값은 중요하지 않습니다 (예 : NO_COLOR=1 NO_COLOR=true 비활성화 색상.
NO_COLOR의 표준 설명을 참조하십시오.

FORCE_COLOR 변수는 값 중 하나가있는 선물이어야합니다.
FORCE_COLOR=0 힘 색상을 비활성화합니다
FORCE_COLOR=1 힘을 활성화합니다
Force_Color의 표준 설명을 참조하십시오.

예를 들어, app.js :

 import { red } from 'ansis' ;

console . log ( red `red color` ) ;

터미널에서 스크립트를 실행하십시오.

 $ node app.js           # colored output in terminal
$ node app.js > log.txt # output in file without ANSI codes

$ NO_COLOR=1 node app.js              # force disable colors, non colored output in terminal
$ FORCE_COLOR=0 node app.js           # force disable colors, non colored output in terminal
$ FORCE_COLOR=1 node app.js > log.txt # force enable colors, output in file with ANSI codes

`COLORTERM` 사용

COLORTERM Environment 변수는 터미널 에뮬레이터에서 색상에 대한 지원을 나타내는 데 사용됩니다. 그 값은 터미널 에뮬레이터와 제공된 색지지 수준에 따라 다를 수 있습니다.

ansis 가 지원하는 일반적으로 사용되는 값 :

truecolor 또는 24bit -16 백만 색상
ansi256 -ANSI 256 색상
ansi 기본 ANSI 16 색상

노드 스크립트를 실행하기 전에 CMD에서 변수를 설정할 수 있습니다.

 COLORTERM=truecolor node script.js # force use truecolor
COLORTERM=ansi256 node script.js   # force use 256 colors
COLORTERM=ansi node script.js      # force use 16 olors

스크립트에서 색상 레벨을 설정하려면 필요한 값으로 COLORTERM 환경 변수를 정의하는 JS 파일을 작성하고 ansis 전에이 파일을 가져 오십시오.

예를 들어 CLI 응용 프로그램을 테스트하여 다른 환경 및 터미널의 지원되는 색상 수준에 관계없이 테스트 결과가 동일 할 수 있도록 유용 할 수 있습니다.

힘을 사용하십시오

Level-Truecolor.js

 process . env . COLORTERM = 'truecolor' ;

스크립트 파일 :

 import './level-truecolor' ; // <= force use truecolor
import { red , ansi256 , hex } from 'ansis' ;

console . log ( hex ( '#FFAB40' ) ( 'orange' ) ) ; // native ANSI RGB color value
console . log ( ansi256 ( 200 ) ( 'pink' ) ) ;     // native ANSI 256 color value
console . log ( red ( 'red' ) ) ;               // native ANSI 16 color value

힘은 256 색을 사용합니다

레벨 256colors.js

 process . env . COLORTERM = 'ansi256' ;

스크립트 파일 :

 import './level-256colors' ; // <= force use 256 colors
import { red , ansi256 , hex } from 'ansis' ;

console . log ( hex ( '#FFAB40' ) ( 'orange' ) ) ; // fallback to ANSI 256 color value
console . log ( ansi256 ( 200 ) ( 'pink' ) ) ;     // native ANSI 256 color value
console . log ( red ( 'red' ) ) ;               // native ANSI 16 color value

힘 사용베이스 16 색

Level-16colors.js

 process . env . COLORTERM = 'ansi' ;

스크립트 파일 :

 import './level-16colors' ; // <= force use 16 olors
import { red , ansi256 , hex } from 'ansis' ;

console . log ( hex ( '#FFAB40' ) ( 'orange' ) ) ; // fallback to ANSI 16 color value - `bright red`
console . log ( ansi256 ( 200 ) ( 'pink' ) ) ;     // fallback to ANSI 16 color value - `bright magenta`
console . log ( red ( 'red' ) ) ;               // native ANSI 16 color value

↑ 상단

CLI 주장

cmd 인수 --no-color 또는 --color=false 사용하여 색상을 비활성화하고 --color 활성화하십시오.

예를 들어, 실행 가능한 스크립트 app.js :

#!/usr/bin/env node
import { red } from 'ansis' ;

console . log ( red `red color` ) ;

터미널에서 스크립트를 실행하십시오.

 $ ./app.js                        # colored output in terminal
$ ./app.js --no-color             # non colored output in terminal
$ ./app.js --color=false          # non colored output in terminal

$ ./app.js > log.txt              # output in file without ANSI codes
$ ./app.js --color > log.txt      # output in file with ANSI codes
$ ./app.js --color=true > log.txt # output in file with ANSI codes

경고
명령 줄 인수는 환경 변수보다 우선 순위가 높습니다.

↑ 상단

색상 지원

ANSIS는 지원되는 색상 공간을 자동으로 감지합니다.

truecolor
ANSI 256 색상
ANSI 16 색
흑백 (색상 없음)

ANSIS에는 출력이 ANSI 색상 및 스타일을 지원하는지 여부에 관계없이 boolean 값을 반환하는 방법에 대한 isSupported() 방법이 있습니다.

 import ansis from 'ansis' ;

console . log ( 'Color output: ' , ansis . isSupported ( ) ) ;

지원되는 색상 공간을 감지하는 표준 방법은 없습니다. 색상지지를 감지하는 가장 일반적인 방법은 TERM 및 COLORTERM 환경 변수를 확인하는 것입니다. CI 시스템은 CI 및 기타 특히 환경 변수의 존재를 확인하여 감지 할 수 있습니다. 이를 프로그램이 실행중인 운영 체제에 대한 지식과 결합하면 색상을 감지 할 수있는 충분한 방법이 있습니다.

단말기	ANSI 16 그림 물감	ANSI 256 그림 물감	진실 색상	env. 용어	env. 색기	특히 ENV 변수
Azure CI	✅			멍청한		tf_build 에이전트 _name
Github CI	✅	✅	✅	멍청한		ci, github_actions
Gittea CI	✅	✅	✅	멍청한		ci, gitea_actions
gitlab ci	✅			멍청한		ci, gitlab_ci
트래비스 CI	✅			멍청한		트래비스
PM2 istty가 아닙니다	✅ ¹	✅ ¹	✅ ¹	멍청한		PM2_HOME pm_id
JetBrains TeamCity > = 2020.1.1	✅	✅				TeamCity_version
JetBrains 아이디어	✅	✅	✅	XTREM-256COLOR		terminal_emulator = 'JetBrains-Jediterm'
대 코드	✅	✅	✅	XTREM-256COLOR	truecolor
창 단말기	✅	✅	✅ ²
창 PowerShell	✅	✅	✅ ²
마코스 터미널	✅	✅		XTREM-256COLOR
Iterm	✅	✅	✅	XTREM-256COLOR	truecolor
터미널 에뮬레이터 키티	✅	✅	✅	Xterm-Kitty
터미널 에뮬레이터 KDE KONSOLE	✅	✅	✅	xterm-direct

또한 참조 :

출력 장치의 트루 콜러 지원.
따라서 터미널에서 색상을 렌더링하고 싶습니다.

↑ 상단

가장 인기있는 라이브러리의 기능을 비교하십시오

다양한 라이브러리에서 일부 기능의 지원을 보려면 명령을 실행하십시오.

 npm run compare

도서관 ________________ - 명명 된 가져 오기 - 이름 지정 색상	ANSI 16 색	ANSI 256 그림 물감	진실 색상	체인 통사론	중첩 템플릿 문자열	새로운 선	색상으로의 폴백	지원합니다 Env vars CLI 플래그
`ansis` `✅ named import` `✅ standard`	✅	✅	✅	✅	✅	✅	→ 256 → 16 → B & W	`NO_COLOR` `FORCE_COLOR` `--no-color` `--color`
`chalk` `named import` `✅ standard`	✅	✅	✅	✅		✅	→ 256 → 16 → B & W	`NO_COLOR` `FORCE_COLOR` `--no-color` `--color`
`kolorist` `✅ named import` `standard`	✅	✅	✅				→ 256 → B & W	`NO_COLOR` `FORCE_COLOR`
`cli-color` `named import` `✅ standard`	✅	✅		✅			→ 16 → B & W	`NO_COLOR`
`colors-cli` `named import` `standard`	✅	✅		✅		✅	→ B & W	`--no-color` `--color`
`colors.js` `named import` `standard`	✅			✅		✅	→ B & W	`FORCE_COLOR` `--no-color` `--color`
`ansi-colors` `named import` `✅ standard`	✅			✅		✅		`FORCE_COLOR`
`colorette` `✅ named import` `✅ standard`	✅						→ B & W	`NO_COLOR` `FORCE_COLOR` `--no-color` `--color`
`picocolors` `named import` `✅ standard`	✅ v1.1.0 이후						→ B & W	`NO_COLOR` `FORCE_COLOR` `--no-color` `--color`
`kleur` `✅ named import` `✅ standard`	`8` 색			✅			→ B & W	`NO_COLOR` `FORCE_COLOR`

메모
import
ESM
import { red, green, blue } from 'lib';
CJS
const { red, green, blue } = require('lib');
이름 지정 색상
표준 : 색상은 표준 이름 (예 : red , redBright , bgRed , bgRedBright 을 가지고 있습니다.
비표준 red_btt 색상은 lib- red_b 적 brightRed 을 가지고 있습니다 bgBrightRed
ANSI 256 색상
메소드 이름 :
colors-cli : x<n>
cli-color : xterm(n)
chalk : ansi256(n) bgAnsi256(n)
ansis : ansi256(n) bgAnsi256(n) fg(n) bg(n)
truecolor
메소드 이름 :
chalk : hex() rgb()
ansis : hex() rgb()
체인 된 구문
lib.red.bold('text')
중첩 된 템플릿 문자열
lib.red`text ${lib.cyan`nested`} text`
새로운 라인
end-of-line 에서 브레이크 스타일을 올바르게하십시오.
 lib.bgGreen(`First Line
Next Line`);

↑ 상단

가장 인기있는 패키지의 크기를 비교하십시오

NPM 패키지	Tarball Size를 다운로드하십시오	포장되지 않은 크기	코드 크기
`picocolors`	2.6 KB	6.4 KB	2.6 KB
`ansis`	3.8 KB	7.4 KB	3.4 KB
`colorette`	4.9 KB	17.0 KB	3.4 KB
`kleur`	6.0 KB	20.3 KB	2.7 KB
`ansi-colors`	8.5 KB	26.1 KB	5.8 KB
`kolorist`	8.7 KB	51.0 KB	6.8 KB
`colors.js`	11.0 KB	39.5 KB	18.1 KB
`chalk`	13.1 KB	43.7 KB	16.4 KB
`cli-color`	13.8 (216 KB)	39.6 (754 KB)	12.1 KB
`colors-cli`	361.7 KB	511.0 KB	8.7 KB

다운로드 크기 : NPM 패키지의 GZIPED 크기.
포장되지 않은 크기 : node_modules/ directory에서 NPM 패키지의 크기 (incl. dependencies) .
코드 크기 : require 통해로드하거나 앱에 import 분산 코드의 크기.

또한 참조 :

NPMJS- 게시 된 패키지의 설치 크기 표시, w/o 종속성
PackagePhobia- 총 설치 크기 표시 의존성
NPM 다운로드 크기 - Tarball 및 총 다운로드 크기 표시
Bundlephobia- 쓸모없는, 다운로드 된 NPM 패키지의 실제 타르 볼 크기가 표시되지 않습니다.

↑ 상단

ANSI 데모를 보여줍니다

git clone https://github.com/webdiscus/ansis.git
cd ./ansis
npm i
npm run demo

벤치 마크

성능을 측정하려면 Benchmark.js가 사용됩니다.

경고

‼ 닐 Vitest 벤치 마크를 사용하여 다른 테스트 결과를 신뢰하지 마십시오 .

vitest benchmark 허위/ 비현실적인 결과를 생성합니다.
예를 들어 간단한 벤치의 결과 :

 chalk.red('foo') -  7.000.000 ops/sec
ansis.red('foo') - 23.000.000 ops/sec (x3 faster is WRONG result)

이 테스트에서 분필과 ANSI의 실제 성능 결과는 매우 유사합니다.

벤치 마크를 실행하십시오

git clone https://github.com/webdiscus/ansis.git
cd ./ansis
npm i
npm run build
npm run bench

테스트
MacBook Pro 16 "M1 Max 64GB
마코스 세쿼이아 15.1
node.js v22.11.0
터미널 iTerm2 v3.5.0

메모

테스트에서 각 라이브러리는 가장 빠른 스타일 방법을 사용하여 각 라이브러리의 절대 성능을 비교합니다.

실제로, 라이브러리가 더 빠르고 짧은 체인 방법을 제공 할 때 가장 느린 방법 (예 : 중첩 콜)을 사용하여 문자열 스타일을 사용하지 않습니다.

예를 들어:

 lib . red . bold . bgWhite ( ' ERROR ' )           // ✅ faster, shorter, readable
lib . red ( lib . bold ( lib . bgWhite ( ' ERROR ' ) ) ) //  slower, longer, unreadable

간단한 벤치

간단한 테스트는 단일 스타일 만 사용합니다. Picocolors, Colorette 및 Kleur는 Chined Syntax 또는 올바른 스타일 브레이크를 지원하지 않으므로 (Wenn은 문자열에서 `n` 사용)이 간단한 사용 사례에서 가장 빠릅니다. 기능이없고 성능 오버 헤드가 없습니다 .

 ansis . red ( 'foo' )
chalk . red ( 'foo' )
picocolors . red ( 'foo' )
. . .

 +  [email protected]    109.212.939 ops/sec
   [email protected]    108.044.800 ops/sec
   [email protected]          87.800.739 ops/sec
- > [email protected]          60.606.043 ops/sec  -44.5%
-  [email protected]          55.702.479 ops/sec  -48.9%
   [email protected]       37.069.069 ops/sec
   [email protected]    14.364.378 ops/sec
   [email protected]          7.060.583 ops/sec
   [email protected]       2.753.751 ops/sec
   [email protected]       897.746 ops/sec

2 가지 스타일을 사용합니다

2 개의 스타일 만 사용하는 Picocolors는 이미 약간 느리게 진행됩니다. Chined Syntax를 사용하는 것이 중첩 된 통화보다 빠르기 때문입니다.

 ansis . red . bold ( 'foo' )
chalk . red . bold ( 'foo' )
picocolors . red ( picocolors . bold ( 'foo' ) ) // chained syntax is not supported
. . .

 +  [email protected]          60.468.181 ops/sec
-  [email protected]     58.777.183 ops/sec    -2.8%
-  [email protected]          47.789.020 ops/sec   -21.5%
   [email protected]     33.387.988 ops/sec
   [email protected]       13.420.047 ops/sec
   [email protected]           5.972.681 ops/sec
   [email protected]     4.086.412 ops/sec
   [email protected]          3.018.244 ops/sec
   [email protected]       1.817.039 ops/sec
   [email protected]       695.601 ops/sec

3 가지 스타일 사용

3 가지 스타일을 사용하는 Picocolors는 ANSIS보다 2 배 느립니다.

 ansis . red . bold . bgWhite ( 'foo' )
chalk . red . bold . bgWhite ( 'foo' )
picocolors . red ( picocolors . bold ( picocolors . bgWhite ( 'foo' ) ) ) // chained syntax is not supported
. . .

 +  [email protected]          59.463.640 ops/sec
-  [email protected]          42.166.783 ops/sec  -29.0%
-  [email protected]     32.434.017 ops/sec  -45.5% (~2x slower than Ansis)
   [email protected]     13.008.117 ops/sec
   [email protected]        5.608.244 ops/sec
   [email protected]           5.268.630 ops/sec
   [email protected]     2.145.517 ops/sec
   [email protected]          1.686.728 ops/sec
   [email protected]       1.453.611 ops/sec
   [email protected]       590.467 ops/sec

4 가지 스타일 사용

드문 경우, 4 가지 스타일을 사용할 때 피코 콜러는 ANSIS보다 3.4 배 느려집니다.

 ansis . red . bold . underline . bgWhite ( 'foo' )
chalk . red . bold . underline . bgWhite ( 'foo' )
picocolors . red ( picocolors . bold ( picocolors . underline ( picocolors . bgWhite ( 'foo' ) ) ) ) // chained syntax is not supported
. . .

 +  [email protected]          59.104.535 ops/sec
-  [email protected]          36.147.547 ops/sec  -38.8%
-  [email protected]     17.581.709 ops/sec  -70.2% (~3x slower than Ansis)
   [email protected]      7.981.171 ops/sec
   [email protected]           4.825.665 ops/sec
   [email protected]        3.729.880 ops/sec
   [email protected]     1.514.053 ops/sec
   [email protected]          1.229.999 ops/sec
   [email protected]       1.210.931 ops/sec
   [email protected]       481.073 ops/sec

깊게 중첩 된 스타일

깊게 중첩 된 단일 스타일을 가진 복잡한 테스트.

 c . green (
  `green ${ c . cyan (
    `cyan ${ c . red (
      `red ${ c . yellow (
        `yellow ${ c . blue (
          `blue ${ c . magenta ( `magenta ${ c . underline ( `underline ${ c . italic ( `italic` ) } underline` ) } magenta` ) } blue` ,
        ) } yellow` ,
      ) } red` ,
    ) } cyan` ,
  ) } green` ,
)

 +  [email protected]      1.110.056 ops/sec
-  [email protected]      1.073.299 ops/sec
- > [email protected]             847.246 ops/sec  -23.7%
   [email protected]          847.110 ops/sec
-  [email protected]             573.942 ops/sec  -48.3%
   [email protected]             471.285 ops/sec
   [email protected]            439.588 ops/sec
   [email protected]       382.862 ops/sec
   [email protected]         213.351 ops/sec
   [email protected]        41.097 ops/sec

컬러 렛 벤치

단일 스타일에 colorette 에 사용되는 벤치 마크.

 c . red ( ` ${ c . bold ( ` ${ c . cyan ( ` ${ c . yellow ( 'yellow' ) } cyan` ) } ` ) } red` )

 +  [email protected]      3.861.384 ops/sec
   [email protected]      3.815.039 ops/sec
- > [email protected]           2.918.269 ops/sec  -24.4%
   [email protected]        2.548.564 ops/sec
-  [email protected]           2.502.850 ops/sec  -35.2%
   [email protected]           2.229.023 ops/sec
   [email protected]     1.426.279 ops/sec
   [email protected]          1.123.139 ops/sec
   [email protected]         481.708 ops/sec
   [email protected]       114.570 ops/sec

Picocolors Complex Bench

picocolors 벤치 마크는 약간 수정되었습니다. 두 가지 스타일이 하나 대신 컬러 단어에 적용하여 조금 더 복잡해졌습니다.

 let index = 1e8 ;
c . red ( '.' ) +
c . yellow ( '.' ) +
c . green ( '.' ) +
c . red . bold ( ' ERROR ' ) +
c . red ( 'Add plugin ' + c . cyan . underline ( 'name' ) + ' to use time limit with ' + c . cyan ( ++ index ) ) ;

 +  [email protected]      2.601.559 ops/sec
- > [email protected]           2.501.227 ops/sec   -3.8%
   [email protected]      2.326.491 ops/sec
-  [email protected]           2.129.106 ops/sec  -18.1%
   [email protected]           1.780.496 ops/sec
   [email protected]        1.685.703 ops/sec
   [email protected]       838.542 ops/sec
   [email protected]            533.362 ops/sec
   [email protected]         287.558 ops/sec
   [email protected]        97.463 ops/sec

메모

실제 용도에 가까운이 테스트에서 각 라이브러리는 사용 가능한 가장 빠른 스타일 방법을 사용합니다.

따라서 chalk , ansis , ansi-colors , cli-color , colors-cli 및 colors Chained Method (예 c.red.bold(' ERROR ') 를 사용합니다. picocolors , colorette 및 kolorist 중첩 된 통화 (예 : c.red(c.bold(' ERROR ')) 사용하지만 체인 구문을 지원하지 않기 때문입니다.

↑ 상단

ANSIS로 전환하는 방법

ANSIS는 많은 유사한 라이브러리에 대한 코드 마이그레이션이 필요하지 않은 강력하고 작고 빠른 교체품입니다.
import ... from ... 또는 require(...) ansis 로 교체하십시오.

분필에 대한 드롭 인 교체, 마이그레이션이 필요 없음

 - import chalk from 'chalk';
+ import chalk from 'ansis';

ANSIS는 Chalk Syntax를 지원하며 스타일과 색상 이름과 호환되므로 원래 코드를 수정할 필요가 없습니다.

 chalk . red . bold ( 'Error!' ) ;

// colorize "Error: file not found!"
chalk . red ( `Error: ${ chalk . cyan . bold ( 'file' ) } not found!` ) ;

// ANSI 256 colors
chalk . ansi256 ( 93 ) ( 'Violet color' ) ;
chalk . bgAnsi256 ( 194 ) ( 'Honeydew, more or less' ) ;

// truecolor
chalk . hex ( '#FFA500' ) . bold ( 'Bold orange color' ) ;
chalk . rgb ( 123 , 45 , 67 ) . underline ( 'Underlined reddish color' ) ;
chalk . bgHex ( '#E0115F' ) ( 'Ruby' ) ;
chalk . bgHex ( '#96C' ) ( 'Amethyst' ) ;

경고

ANSIS는 널리 지원되지 않고 아무도 사용하지 않기 때문에 overline 스타일을 지원하지 않습니다.
코드를 확인하고 overline 스타일을 제거하십시오.

 - chalk.red.overline('text');
+ chalk.red('text');

선택적으로 동일한 코드를 다시 작성하여 더 짧고 깨끗하게 만들 수 있습니다.

 import { red , cyan , ansi256 , bgAnsi256 , fg , bg , hex , rgb , bgHex , bgRgb } from 'ansis' ;

red . bold ( 'Error!' ) ; // using parentheses
red . bold `Error!` ;   // using template string

// colorize "Error: file not found!"
red `Error: ${ cyan . bold `file` } not found!` ;

// ANSI 256 colors
ansi256 ( 93 ) `Violet color` ;
bgAnsi256 ( 194 ) `Honeydew, more or less` ;
fg ( 93 ) `Violet color` ; // alias for ansi256
bg ( 194 ) `Honeydew, more or less` ;  // alias for bgAnsi256

// truecolor
hex ( '#FFA500' ) . bold `Bold orange color` ;
rgb ( 123 , 45 , 67 ) . underline `Underlined reddish color` ;
bgHex ( '#E0115F' ) `Ruby` ;
bgHex ( '#96C' ) `Amethyst` ;

↑ 상단

Colorette의 드롭 인 교체, 마이그레이션이 필요하지 않습니다

 - import { red, bold, underline } from 'colorette';
+ import { red, bold, underline } from 'ansis';

ANSIS는 colorette 스타일 및 색상 이름과 완전히 호환되므로 원래 코드를 수정할 필요가 없습니다.

 red . bold ( 'Error!' ) ;
bold ( `I'm ${ red ( `da ba ${ underline ( "dee" ) } da ba` ) } daa` ) ;

선택적으로 동일한 코드를 다시 작성하여 더 짧고 깨끗하게 만들 수 있습니다.

 red . bold `Error!` ;
bold `I'm ${ red `da ba ${ underline `dee` } da ba` } daa` ;

↑ 상단

피코 콜러에 대한 드롭 인 교체, 마이그레이션이 필요 없음

 - import pico from 'picocolors';
+ import pico from 'ansis';

ANSIS는 picocolors 스타일 및 색상 이름과 완전히 호환되므로 원본 코드를 수정할 필요가 없습니다.

 pico . red ( pico . bold ( 'text' ) ) ;
pico . red ( pico . bold ( variable ) ) ;

// colorize "Error: file not found!"
pico . red ( 'Error: ' + pico . cyan ( pico . bold ( 'file' ) ) + ' not found!' ) ;

선택적으로 동일한 코드를 다시 작성하여 더 짧고 깨끗하게 만들 수 있습니다.

 import { red , cyan } from 'ansis' ;

red . bold `text` ;
red . bold ( variable ) ;

// colorize "Error: file not found!"
red `Error: ${ cyan . bold `file` } not found!`

↑ 상단

ANSI 색상의 드롭 인 교체, 마이그레이션이 필요하지 않습니다

 - const c = require('ansi-colors');
+ const c = require('ansis');

ANSIS는 ansi-color 스타일 및 색상 이름과 완전히 호환되므로 원본 코드를 수정할 필요가 없습니다.

 c . red . bold ( 'Error!' ) ;

// colorize "Error: file not found!"
c . red ( `Error: ${ c . cyan . bold ( 'file' ) } not found!` ) ;

선택적으로 동일한 코드를 다시 작성하여 더 짧고 깨끗하게 만들 수 있습니다.

 import { red , cyan } from 'ansis' ;

red . bold ( 'Error!' ) ; // using parentheses
red . bold `Error!` ;   // using template string

// colorize "Error: file not found!"
red `Error: ${ cyan . bold `file` } not found!` ;

↑ 상단

클리르에서 이주

 - import { red, green, yellow, cyan } from 'kleur';
+ import { red, green, yellow, cyan } from 'ansis';

ANSIS는 kleur 스타일 및 색상 이름과 완전히 호환되지만 Kleur v3.0 더 이상 Chalk 스타일 구문 (Magical Getter)을 사용하지 않습니다.

 green ( ) . bold ( ) . underline ( 'this is a bold green underlined message' ) ;
yellow ( `foo ${ red ( ) . bold ( 'red' ) } bar ${ cyan ( 'cyan' ) } baz` ) ;

Chained Methods를 사용하는 경우 간단한 코드 수정이 필요합니다. (). 와 함께 . :

 green . bold . underline ( 'this is a bold green underlined message' ) ;
yellow ( `foo ${ red . bold ( 'red' ) } bar ${ cyan ( 'cyan' ) } baz` ) ;

선택적으로 동일한 코드를 다시 작성하여 더 짧고 깨끗하게 만들 수 있습니다.

 yellow `foo ${ red . bold `red` } bar ${ cyan `cyan` } baz` ;

↑ 상단

클리 컬러에서 마이그레이션

 - const clc = require('cli-color');
+ const clc = require('ansis');

ANSIS는 cli-color 스타일 및 색상 이름과 호환됩니다.

 clc . red . bold ( 'Error!' ) ;

// colorize "Error: file not found!"
clc . red ( `Error: ${ c . cyan . bold ( 'file' ) } not found!` ) ;

경고

ANSIS는 널리 지원되지 않고 아무도 사용하지 않기 때문에 blink 스타일을 지원하지 않습니다.
코드를 확인하고 blink 스타일을 제거하십시오.

 - clc.red.blink('text');
+ clc.red('text');

ANSI 256 COLOR 함수 xterm 또는 bgXterm 를 사용하는 경우 ansi256 fn 또는 bgAnsi256 bg 로 대체해야합니다.

 - clc.xterm(202).bgXterm(236)('Orange text on dark gray background');
+ clc.ansi256(202).bgAnsi256(236)('Orange text on dark gray background');

선택적으로 동일한 코드를 다시 작성하여 더 짧고 깨끗하게 만들 수 있습니다.

 import { red , cyan , fg , bg } from 'ansis' ;

red . bold `Error!` ;

// colorize "Error: file not found!"
red `Error: ${ cyan . bold `file` } not found!` ;

fg ( 202 ) . bg ( 236 ) `Orange text on dark gray background` ;

↑ 상단

테스트

npm run test 장치 및 통합 테스트를 실행합니다.
npm run test:coverage 적용 범위로 테스트를 실행합니다.

↑ 상단

특허

ISC

지원 ^되는 색상은 실제 터미널 ^에 따라 다릅니다.
Windows 터미널은 Windows 10 개정 14931 (2016-09-21) 이후 진정한 색상을 지원합니다. ↩ ²

확장하다

ansis

ANSI 스타일

ANSIS로 전환하는 이유를 설치하고 빠르게 시작하십시오

용법

⚖️ 유사한 라이브러리

하이라이트

? 사용

westion / 기능 요청 / 버그

Ansis로 전환하는 이유

? 포장되지 않은 크기

⚡ 성능

? 유지

? 어느 것을 사용해야합니까?

ANSIS로 전환하는 방법

↑ 상단

설치 및 빠른 시작

↑ 상단

import

템플릿 리터럴

체인 된 구문

↑ 상단

중첩 된 구문

↑ 상단

기본 ANSI 16 색상 및 스타일

기본 색상을 확장합니다

↑ 상단

ANSI 256 색상

폴백

사용 예제

truecolor

↑ 상단

폴백

↑ 상단

ANSI 코드를 사용하십시오

ANSI 코드를 스트립하십시오

↑ 상단

새로운 라인

바로 가기 / 테마

↑ 상단

CLI 환경 변수

COLORTERM 사용

힘을 사용하십시오

힘은 256 색을 사용합니다

힘 사용베이스 16 색

↑ 상단

CLI 주장

↑ 상단

색상 지원

↑ 상단

가장 인기있는 라이브러리의 기능을 비교하십시오

↑ 상단

가장 인기있는 패키지의 크기를 비교하십시오

↑ 상단

ANSI 데모를 보여줍니다

벤치 마크

벤치 마크를 실행하십시오

테스트

간단한 벤치

2 가지 스타일을 사용합니다

3 가지 스타일 사용

4 가지 스타일 사용

깊게 중첩 된 스타일

컬러 렛 벤치

Picocolors Complex Bench

↑ 상단

ANSIS로 전환하는 방법

분필에 대한 드롭 인 교체, 마이그레이션이 필요 없음

↑ 상단

Colorette의 드롭 인 교체, 마이그레이션이 필요하지 않습니다

↑ 상단

피코 콜러에 대한 드롭 인 교체, 마이그레이션이 필요 없음

↑ 상단

ANSI 색상의 드롭 인 교체, 마이그레이션이 필요하지 않습니다

↑ 상단

클리르에서 이주

↑ 상단

클리 컬러에서 마이그레이션

↑ 상단

테스트

↑ 상단

`COLORTERM` 사용