vue插件

chalk.js(node终端样式库)

2019-08-07  本文已影响0人  copyLeft

github

基本格式

chalk.[.<style>...](string)

chalk[样式关键字_1][样式关键字_2](输出内容)

例子

<pre spellcheck="false" class="md-fences md-end-block ty-contain-cm modeLoaded" lang="javascript" contenteditable="true" cid="n33" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 8px 4px 6px; margin-bottom: 15px; margin-top: 15px; width: inherit; color: rgb(51, 51, 51); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">const chalk = reuquire("chalk")
const log = console.log
​
// 颜色字体
log( chalk.red("红色") ) 
​
// 背景色
log( chalk.bgBlue("蓝色背景") )  
​
// 样式字体
log( chalk.bold("加粗") )
​
// 多参数
log( chalk.blue("name", "age", "job") )
​
// ES6 多行文本
log(
 // 多行文本将保留缩进格式
 chalk.blue(`
 name: Rogan
 age: ${25}
 job: ${ 'IT' }
 `)
)
​
​
// 其他颜色设置方式
log(chalk.keyword("orange")(' keyword ')) // 关键字
log(chalk.rgb(100, 100, 100)(' rgb ')) // rgb
log(chalk.hex('#ffffff')(' hex ')) // hex
​
​
​
// 样式组合
log(` colors: ${chalk.blue('blue')}, ${chalk.red('red')} `) // 拼接
​
log(chalk.blue.bold("Title")) // 链式组合
​
log( chalk.bgYellow(` error: ${chalk.red(" chalk is undefined ")} `) ) // 嵌套
​
​
​
// 自定义组合
const error = chalk.bgRed;
const warning = chalk.yellow.bold;</pre>

样式api

前景色关键字(非全支持)

背景色关键字(非全支持)

取色模式

上一篇下一篇

猜你喜欢

热点阅读