VsCode快速打出console.log()方法设置

一、背景

作为一名前端开发,console.log是一个使用频率极高的调试功能,接下来让我们看看如何快速的打出console.log()。

二、VsCode设置

1、找到文件 > 首选项 > 配置代码片段;
2、输入javascript.json,并点击提示;

先在弹出的输入框内填入javascript.json,选择提示进而跳转相应页面。

如果是用React框架,就选择javascriptreact.json进行配置,博主这里以javascriptreact.json举例,其他类似:

XML 复制代码
{
	// Place your snippets for javascriptreact here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	"Print to console": {
		"prefix": "log",//这里配置快速打印console.log的字母,例如:输入log,实现手动console.log效果
		"body": [
			"console.log('$1');",
			"$2"
		],
		"description": "Log output to console"
	}
}
3.修改prefix为你喜欢的打出console.log()风格,我自己设置的是log;

如果你的Print to console被注释了,直接解除注释,修改prefix中的值为你喜欢的console.log风格即可。(记得保存哟)

相关推荐
承渊政道9 小时前
Linux系统学习【Linux基础开发工具】
linux·运维·笔记·学习·centos·编辑器
you-_ling9 小时前
IO编程相关知识
c语言·vscode
学嵌入式的小杨同学17 小时前
【Linux 封神之路】信号编程全解析:从信号基础到 MP3 播放器实战(含核心 API 与避坑指南)
java·linux·c语言·开发语言·vscode·vim·ux
徐小夕@趣谈前端1 天前
Web文档的“Office时刻“:jitword共建版2.0发布!让浏览器变成本地生产力
前端·数据结构·vue.js·算法·开源·编辑器·es6
zhanglianzhao1 天前
Win 11 WSL 配置Claude code 并在VsCode中使用
ide·vscode·编辑器·claude·cladue code
Keying,,,,1 天前
VScode中终端闪退问题
ide·vscode·编辑器
热爱生活的五柒1 天前
如何在vscode中使用Claude code以及插件中配置setting.json无效的解决方法
ide·vscode·编辑器
ONLYOFFICE1 天前
ONLYOFFICE 自动化工具:宏和 AI 函数如何选择?
运维·自动化·编辑器·onlyoffice
浩瀚之水_csdn1 天前
vscode中运行html语言
ide·vscode·html
JQLvopkk1 天前
VSCode基础使用
ide·vscode·编辑器