Visual Studio Code は言語固有のカスタム コード ブロックを設定します

1. 特定の言語の json ファイルを開きます

ファイル (File) -> 環境設定 (Preferences) -> ユーザー スニペット (ユーザー スニペットの構成) -> スニペットを表示する言語を選択します。(以下の例として vue を使用します)
注: macOS: コード (コード) > 設定 (プリファレンス)

2. コード セグメントを追加します。
"Print to console": コード ブロックの名前、
"prefix": コード セグメントの展開とテキストへの挿入をトリガーするために使用されるプレフィックス、
"body": コード ブロックの内容;
"説明": 説明;


公式の例:

vue.json
{
     "Print to console": {
	 	"prefix": "log",
	 	"body": [
	 		"console.log('$1');",
	 		"$2"
	 	],
	 	"description": "Log output to console"
	 }
}

vue-例

vue.json
{
    "vue2 code": {
		"prefix": "vue2",
		"body": [
			"<template>",
			"\t<div>",
			" ",
			"\t</div>",
			"</template>",
			"<script>",
			"export default {",
			"\tname:'',",
			"\tcomponents: {",
			" ",
			"\t},",
			"\tdata() {",
			"\t\treturn {",
			" ",
			"\t\t}",
			"\t},",
			"\tcreated() {",
			"",
			"\t},",
			"\tmethods: {",
			" ",
			"\t},",
			"}",
			"</script>",
			"<style lang=\"scss\" scoped>",
			" ",
			"</style>"
		],
		"description": "vue2 basic module"
	},    
}

 3. 複数のコード ブロックを設定して、
json ファイルに複数のオブジェクトを書き込みます。

vue.json
{
	"Print to console": {
		"prefix": "log",
		"body": [
			"console.log('$1');",
			"$2"
		],
		"description": "Log output to console"
	},
	"vue2 code": {
		"prefix": "vue2",
		"body": [
			"<template>",
			"\t<div>",
			" ",
			"\t</div>",
			"</template>",
			"<script>",
			"export default {",
			"\tname:'',",
			"\tcomponents: {",
			" ",
			"\t},",
			"\tdata() {",
			"\t\treturn {",
			" ",
			"\t\t}",
			"\t},",
			"\tcreated() {",
			"",
			"\t},",
			"\tmethods: {",
			" ",
			"\t},",
			"}",
			"</script>",
			"<style lang=\"scss\" scoped>",
			" ",
			"</style>"
		],
		"description": "vue2 basic module"
	},
}

4. コード ブロックを使用する
コード ブロックを挿入する必要がある場合は、プレフィックス (vue2) を入力して Enter キーを押します。

おすすめ

転載: blog.csdn.net/m0_65894854/article/details/129945598