VSCode自定义代码片段

最新推荐文章于 2025-06-12 11:00:03 发布

爬山虎还上班

最新推荐文章于 2025-06-12 11:00:03 发布

阅读量479

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签：前端 vscode自定义代码片段

本文链接：https://blog.csdn.net/jinborui2/article/details/124671985

前端专栏收录该内容

1 篇文章

订阅专栏

本文介绍了如何在Visual Studio Code中创建和使用自定义代码片段，以提高编程效率。通过设置`scope`、`prefix`、`body`和`description`，用户可以快速插入常用代码结构。例如，创建一个名为`test`的代码片段，输入`test`后，编辑器将提供提示并自动补全预定义的函数模板。这个功能允许开发者根据个人习惯和项目需求定制快捷代码，节省时间并减少错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

File => Preferences => User Snippets

选择第一个全局的

按照给出的格式：

scope：作用域（省略或者空，表示作用于所有语言），prefix:前缀（也是我们使用片段时需要输出的提示语），body：是我们的正文代码的内容，description：描述

例：

"测试": {
	"prefix": "test",
	"body": [
		"function $3() {",
		"console.log('$4')",
		"}"
	],
	"description": "测试片段"
}

保存后，在编辑器中输出test会有提示

然后回车，会自动补全我们设置的自定义代码片段

其中$数字，在输出提示语展示所有body内容时，光标会聚焦到哪里，方便用户输出变量值，相同的变量会关联，按tab键切换到一下个变量位置。