如何自定义个人的 VS Code 代码片段

# 如何自定义个人的 VS Code 代码片段

自定义个人的代码片段, 以防抖函数为例, 注册一个全局代码块

function debounce(fn, wait) {
  let timeoutId
  return function(...args) {
    timeoutId && clearTimeout(timeoutId)
    timeoutId = setTimeout(() => fn.apply(this, args), wait)
  }
}
1
2
3
4
5
6
7

Mac:

-> command + shift + p

-> 输入 snippets 关键字进行查找, 选择 Snippets: Configure User Snippets

-> 选择 New Global Snippets file

-> 输入 snippets 名后, 例如: debounce

debounce.code-snippets

这里可以用一个工具生成: https://snippet-generator.app (opens new window)

{
	"debounce": {
		"scope": "javascript",
		"prefix": "debounce",
		"body": [
			"function debounce(fn, ms = 0) {",
			"  let timeoutId;",
			"  return function(...args) {",
			"    clearTimeout(timeoutId);",
			"    timeoutId = setTimeout(() => fn.apply(this, args), ms)",
			"  }",
			"}"
		],
		"description": "Log output to console"
	}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

接下来就可以在任意 js 文件中使用了

输入 debounce, 就能看到提示了

debounce snippets