返回动态
3 分钟阅读

Node.js在控制台彩色输出的方法及原理

我们都知道，在nodejs环境下使用普通的console.log,console.error,console.info输出都是不会有颜色的，如果你不知道，那你现在知道啦😏。在这种情况下，如果我们需要彩色输出，则通常通过chalk这个node模块来实现，

chalk使用方法

基本用法

const chalk = require('chalk')
console.log(chalk.red.bold.bgWhite('Leo\\'s Blog'))

上面代码执行的结果如下，Leo's Blog 加粗，字体颜色是红色，背景颜色是白色。

注意：背景颜色要在 bg 后面加上具体的颜色，颜色的第一个字母大写。

在 HTML 中支持 RGB 颜色，在这里同样支持，而且是支持所有 HTML 中支持的颜色，如十六进制颜色。这里仅仅说明十六进制颜色。

下面的代码会和上面的代码实现相同的效果。

const chalk = require('chalk')
console.log(chalk.rgb(255,0,0).bold.bgRgb(255,255,255)('Leo\\'s Blog'))

使用模板

该模块有一个很方便的用法就是支持模板输出，也就是说，不管在字符串中的哪个位置想改变输出的颜色，都是可以的。

const chalk = require('chalk')
console.log(chalk`{red.bold.bgWhite Leo\\'s Blog}`)

当然，也可以使用 RGB 颜色值。

const chalk = require('chalk')
console.log(chalk`{rgb(255,0,0).bold.bgRgb(255,255,255) Leo\\'s Blog}`)

image

常见形式

我们经常看到的警告、错误提示就是这么来的

const chalk = require('chalk')

const error = chalk.bold.red;
const warning = chalk.keyword('orange')

console.log(error('Error!'))
console.log(warning('Warning!'))

image

常用API

样式

  • reset - 样式重置

  • bold - 加粗

  • dim - 浅高亮

  • italic - 斜体

  • underline - 下划线

  • inverse- 反转前景和背景色

  • hidden - 隐藏内容

  • strikethrough - 删除线

  • visible- 显示chalk level > 0 的内容

前景色关键字（非全支持）

  • black

  • red

  • green

  • yellow

  • blue

  • magenta

  • cyan

  • white

  • blackBright (alias: gray, grey)

  • redBright

  • greenBright

  • yellowBright

  • blueBright

  • magentaBright

  • cyanBright

  • whiteBright

背景色关键字（非全支持）

  • bgBlack

  • bgRed

  • bgGreen

  • bgYellow

  • bgBlue

  • bgMagenta

  • bgCyan

  • bgWhite

  • bgBlackBright (alias: bgGray, bgGrey)

  • bgRedBright

  • bgGreenBright

  • bgYellowBright

  • bgBlueBright

  • bgMagentaBright

  • bgCyanBright

  • bgWhiteBright

更多API可以看看官方文档。

chalk让控制台输出样式多变的原理

其原理最重要的一个知识点就是ANSI Escape code.

ASCII编码中有些字符是不能用来在终端中打印显示的，比如'\\a' 0x7代表响铃，'\\n' 0x0A 代表换行，这些字符被称为控制符。

而其中的一个控制符 '\\e' 0x1B比较特殊，这个字符代表 ESC ，即键盘上 ESC 按键的作用。ESC 是单词 escape 的缩写，即逃逸的意思。文本中出现这个控制符，表示接下来的字符是ANSI Escape code编码。

而ANSI Escape code编码中有专门控制字符颜色的控制符，例如：\\e[31;44;4;1m

其意义如下：

  • \\e 代表开始ANSI Escape code

  • [ 代表转义序列开始符 CSI，Control Sequence Introducer

  • 31;44;4;1 代表以; 分隔的文本样式控制符，其中 31 代表文本前景色为红色，44代表背景为蓝色，4代表下划线，1代表加粗

  • m 代表结束控制符序列

我们可以在终端中输入如下命令：

echo -e "\\e[37;44;4;1mLEO\\e[0m"

会有如下输出，带下划线的LEO字样：

image

因为 \\e 控制符的16进制码为 0x1B ， 8 进制码为 033 ，也可以用以下写法达到同样效果：

echo -e "\\e[37;44;4;1mLEO\\e[0m"
echo -e "\\x1b[37;44;4;1mLEO\\x1b[0m"
echo -e "\\x1B[37;44;4;1mLEO\\x1B[0m"
echo -e "\\033[37;44;4;1mLEO\\033[0m"

image

通过维基百科，我查到有以下参数控制符：

颜色编码表如下：

示例：

\\e[31m 红色
\\e[36;5;1;4m 缓慢闪烁的青色加粗带下划线字体

评论