我一直在努力扩展 console.log
做一个多彩的保留堆栈跟踪 至于它在哪里被调用。我尝试了一些解决方案,但最终达到了这一点:
export const colorizedLog = (
text: string,
status: keyof typeof ColorStatus = "dark",
...args: any
) =>
console.log.bind(
console,
`%c ${text}`,
`font-weight:bold; color: ${ColorStatus[status]}`,
...args
);
有了这个小binding
,我们将能够保留堆栈跟踪,但这里的问题是我们必须将它与烦人的额外 ()
一起使用最后,因为返回值是函数本身,它是 bind
的结果: colorizedLog(
"Title:",
"info",
"This is a working example")();
我读过的其他主要资源如下:const colorizedLog = (text, color= "#40a7e3", ...args) =>
console.log.bind(
console,
`%c ${text}`,
`font-weight:bold; color:${color}`,
...args
);
colorizedLog("Title:", "#40a7e3", "This is a working example")();
更新:堆栈跟踪
使用AppVersion.ts
应用程序.vue
Chrome 控制台
最佳答案
您可以立即调用它:
const colorizedLog = (text, color= "#40a7e3", ...args) =>
console.log.bind(
console,
`%c ${text}`,
`font-weight:bold; color:${color}`,
...args
)();
colorizedLog("Title:", "#40a7e3", "This is a working example");
关于javascript - 如何扩展可以接受 args 的 console.log,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66182606/