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}`)
四种方式的输出
常见形式
我们经常看到的警告、错误提示就是这么来的
const chalk = require('chalk') const error = chalk.bold.red; const warning = chalk.keyword('orange') console.log(error('error!')) console.log(warning('warning!'))
错误和警告提示
常用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字样:
echo-leo
因为 \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"
echo
通过*,我查到有以下参数控制符:
代码 | 作用 | 备注 |
---|---|---|
0 | 重置/正常 | 关闭所有属性。 |
1 | 粗体或增加强度 | |
2 | 弱化(降低强度) | 未广泛支持。 |
3 | 斜体 | 未广泛支持。有时视为反相显示。 |
4 | 下划线 | |
5 | 缓慢闪烁 | 低于每分钟150次。 |
6 | 快速闪烁 | ms-dos ansi.sys;每分钟150以上;未广泛支持。 |
7 | 反显 | 前景色与背景色交换。 |
8 | 隐藏 | 未广泛支持。 |
9 | 划除 | 字符清晰,但标记为删除。未广泛支持。 |
10 | 主要(默认)字体 | |
11–19 | 替代字体 | 选择替代字体{\displaystyle n-10}{\displaystyle n-10}。 |
20 | 尖角体 | 几乎无支持。 |
21 | 关闭粗体或双下划线 | 关闭粗体未广泛支持;双下划线几乎无支持。 |
22 | 正常颜色或强度 | 不强不弱。 |
23 | 非斜体、非尖角体 | |
24 | 关闭下划线 | 去掉单双下划线。 |
25 | 关闭闪烁 | |
27 | 关闭反显 | |
28 | 关闭隐藏 | |
29 | 关闭划除 | |
30–37 | 设置前景色 | 参见下面的颜色表。 |
38 | 设置前景色 | 下一个参数是5;n或2;r;g;b,见下。 |
39 | 默认前景色 | 由具体实现定义(按照标准)。 |
40–47 | 设置背景色 | 参见下面的颜色表。 |
48 | 设置背景色 | 下一个参数是5;n或2;r;g;b,见下。 |
49 | 默认背景色 | 由具体实现定义(按照标准)。 |
51 | framed | |
52 | encircled | |
53 | 上划线 | |
54 | not framed or encircled | |
55 | 关闭上划线 | |
60 | 表意文字下划线或右边线 | 几乎无支持。 |
61 | 表意文字双下划线或双右边线 | |
62 | 表意文字上划线或左边线 | |
63 | 表意文字双上划线或双左边线 | |
64 | 表意文字着重标志 | |
65 | 表意文字属性关闭 | 重置60–64的所有效果。 |
90–97 | 设置明亮的前景色 | aixterm(非标准)。 |
100–107 | 设置明亮的背景色 | aixterm(非标准)。 |
颜色编码表如下:
名称 | 前景色代码 | 背景色代码 |
---|---|---|
黑 | 30 | 40 |
红 | 31 | 41 |
绿 | 32 | 42 |
黄 | 33 | 43 |
蓝 | 34 | 44 |
品红 | 35 | 45 |
青 | 36 | 46 |
白 | 37 | 47 |
亮黑(灰) | 90 | 100 |
亮红 | 91 | 101 |
亮绿 | 92 | 102 |
亮黄 | 93 | 103 |
亮蓝 | 94 | 104 |
亮品红 | 95 | 105 |
亮青 | 96 | 106 |
亮白 | 97 | 107 |
示例:
\e[31m 红色 \e[36;5;1;4m 缓慢闪烁的青色加粗带下划线字体
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对的支持。
上一篇: vue实现淘宝购物车功能
下一篇: node.js中npm包管理工具用法分析