JavaScript chalk

JavaScript chalk 教程展示了如何使用 chalk 模块在 JavaScript 中设置文本样式。

chalk 是一个 Node.js 模块,用于设置文本格式的样式并允许我们创建自己的主题。

请注意,终端可能不支持 chalk 模块的所有功能。

JS粉笔简单例子

下面的例子是chalk模块的简单演示。

import chalk from 'chalk';

console.log(chalk.blue('an old falcon'));
console.log(chalk.keyword('steelblue')('an old falcon'));
console.log(chalk.keyword('khaki').bold('an old falcon'));

我们向终端打印三种颜色的文本。

console.log(chalk.blue('an old falcon'));

使用chalk.blue,我们输出蓝色文本。

console.log(chalk.keyword('steelblue')('an old falcon'));

使用keyword,我们可以使用颜色的名称。

console.log(chalk.keyword('khaki').bold('an old falcon'));

chalk 支持链式 API;文本以粗体卡其色显示。

JS chalk 基本文字颜色

粉笔模块具有基本文本颜色的功能。

import chalk from 'chalk';

console.log(chalk.red('An old falcon'));
console.log(chalk.blue('An old falcon'));
console.log(chalk.green('An old falcon'));
console.log(chalk.cyan('An old falcon'));
console.log(chalk.white('An old falcon'));
console.log(chalk.redBright('An old falcon'));
console.log(chalk.greenBright('An old falcon'));

在示例中,我们以基本颜色输出文本。

console.log(chalk.red('An old falcon'));

我们输出红色文本。

console.log(chalk.redBright('An old falcon'));

这里我们输出亮红色的文本。

JS 粉笔背景色

我们可以改变文本背景的颜色。

import chalk from 'chalk';

console.log(chalk.bgRed('An old falcon'));
console.log(chalk.bgBlue('An old falcon'));
console.log(chalk.bgWhite.blue('An old falcon'));
console.log(chalk.bgWhiteBright.red('An old falcon'));
console.log(chalk.bgHex('#456323')('An old falcon'));

在示例中,我们更改了输出的背景颜色。

console.log(chalk.bgRed('An old falcon'));

使用bgRed,我们将背景颜色更改为红色。

console.log(chalk.bgWhite.blue('An old falcon'));

我们将背景颜色更改为白色。由于默认文本颜色也是白色,我们将其更改为蓝色。

console.log(chalk.bgHex('#456323')('An old falcon'));

我们可以使用bgHex 选择自定义背景颜色。

JS 粉笔颜色模式

在粉笔中,我们可以使用多种颜色模式。

import chalk from 'chalk';

console.log(chalk.rgb(232, 34, 122)('An old falcon'));
console.log(chalk.hex('#943255')('An old falcon'));
console.log(chalk.ansi(245)('An old falcon'));
console.log(chalk.hsv(125, 8, 61)('An old falcon'));

在示例中,我们使用了 RGB、HEX、ANSI 和 HSV 模式。

JS 粉笔修饰符

粉笔支持多种修饰符,包括粗体、斜体和下划线。

import chalk from 'chalk';

console.log(chalk.bold('An old falcon'));
console.log(chalk.dim('An old falcon'));
console.log(chalk.italic('An old falcon'));
console.log(chalk.underline('An old falcon'));
console.log(chalk.inverse('An old falcon'));
console.log(chalk.strikethrough('An old falcon'));

console.log('----------------------');

console.log(chalk.bold.italic('An old falcon'));
console.log(chalk.dim.italic('An old falcon'));

该示例使用了多个粉笔修饰符。这些也可以组合。例如,chalk.bold.italic 创建粗体和斜体文本。

JS chalk 模板字面量

chalk 模块可以在模板字面量中使用。模板文字是允许嵌入表达式的字符串文字。占位符中的表达式和反引号 (` `) 之间的文本。

import chalk from 'chalk';

console.log(`${chalk.red('old falcon')}`);
console.log(`${chalk.blue('old falcon')}`);
console.log(`${chalk.dim.underline('old falcon')}`);

在示例中,我们使用 chalk 和 JS 模板文字输出三行。

JS chalk 标记的模板文字

标记的模板文字是模板文字的更高级形式。

import chalk from 'chalk';

console.log(chalk`{red old falcon}`);
console.log(chalk`{blue old falcon}`);
console.log(chalk`{dim.underline old falcon}`);

该示例将 chalk 模块与标记的模板文字结合使用。

在本文中,我们使用 chalk 模块在 JavaScript 中设置了文本样式。

列出所有 JavaScript 教程。

赞(0) 打赏

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏