Console.log CSS 模板文字中的样式

Question

我正在创建一个在控制台上玩的游戏，我想装饰我的 console.log 消息，使它们更加耀眼。

由于我是编码新手，所以我想在 console.log 一条消息时随时学习使用模板文字。

如果我恢复使用引号和串联，我可以像这样设置 console.log 消息的样式：console.log('%c some message' + someVar, 'color: red')

如何使用模板字面量来设置 console.log 消息的样式？

Answer 1

您可以为 console.log 的第一个参数使用模板文字而不是串联。

console.log(`%c some message ${someVar}`, 'color: red')

您也可以通过为第二个参数使用模板文字来使用动态样式。

Answer 2

您可以使用这种格式。

console.log(`%c ${message} ${someVar}`, `color:${color}`)

很有魅力。