VSCode設定コードブロック(Snippets)、vueテンプレートのショートカット初期化

この文書では、Vue Snippetsの設定を記録し、vueテンプレートをすばやく初期化します(Mac版VSCode、Windowsで試行中).
一、User Snippetの使用
Code->Preference->User Snippets->New(global)Snippets(現在のファイルとグローバル構成を選択可能)、次の構成をコピーして保存します.使用:“prefix”の値はショートカットで、.vue接尾辞が適用されるファイルです.以下はvueテンプレートの初期化の例として使用しますが、このフォーマットに基づいてコードブロックをカスタマイズすることもできます.

{
	"Print to console": {
		"prefix": "vue",
		"body": [
			"",
			",
			"
$5
",
			"",
			"",
			""</span><span class="token punctuation">,</span>
			<span class="token string">"//           （  ：  ，  js，     js，json  ，      ）"</span><span class="token punctuation">,</span>
			<span class="token string">"//   ：import 《    》 from '《    》';"</span><span class="token punctuation">,</span>
			<span class="token string">""</span><span class="token punctuation">,</span>
			<span class="token string">"export default {"</span><span class="token punctuation">,</span>
			<span class="token string">"// import                 "</span><span class="token punctuation">,</span>
			<span class="token string">"  components: {},"</span><span class="token punctuation">,</span>
			<span class="token string">"  data () {"</span><span class="token punctuation">,</span>
			<span class="token string">"  //       "</span><span class="token punctuation">,</span>
			<span class="token string">"    return {"</span><span class="token punctuation">,</span>
			<span class="token string">""</span><span class="token punctuation">,</span>
			<span class="token string">"    }"</span><span class="token punctuation">,</span>
			<span class="token string">"  },"</span><span class="token punctuation">,</span>
			<span class="token string">"  //         data  "</span><span class="token punctuation">,</span>
			<span class="token string">"  computed: {},"</span><span class="token punctuation">,</span>
			<span class="token string">"  //   data      "</span><span class="token punctuation">,</span>
			<span class="token string">"  watch: {},"</span><span class="token punctuation">,</span>
			<span class="token string">"  //     "</span><span class="token punctuation">,</span>
			<span class="token string">"  methods: {"</span><span class="token punctuation">,</span>
			<span class="token string">""</span><span class="token punctuation">,</span>
			<span class="token string">"  },"</span><span class="token punctuation">,</span>
			<span class="token string">"  //      -     （      this  ）"</span><span class="token punctuation">,</span>
			<span class="token string">"  created () {"</span><span class="token punctuation">,</span>
			<span class="token string">""</span><span class="token punctuation">,</span>
			<span class="token string">"  },"</span><span class="token punctuation">,</span>
			<span class="token string">"  //      -     （    DOM  ）"</span><span class="token punctuation">,</span>
			<span class="token string">"  mounted () {"</span><span class="token punctuation">,</span>
			<span class="token string">""</span><span class="token punctuation">,</span>
			<span class="token string">"  },"</span><span class="token punctuation">,</span>
			<span class="token string">"  beforeCreate () {}, //      -     "</span><span class="token punctuation">,</span>
			<span class="token string">"  beforeMount () {}, //      -     "</span><span class="token punctuation">,</span>
			<span class="token string">"  beforeUpdate () {}, //      -     "</span><span class="token punctuation">,</span>
			<span class="token string">"  updated () {}, //      -     "</span><span class="token punctuation">,</span>
			<span class="token string">"  beforeDestroy () {}, //      -     "</span><span class="token punctuation">,</span>
			<span class="token string">"  destroyed () {}, //      -     "</span><span class="token punctuation">,</span>
			<span class="token string">"  activated () {} //      keep-alive    ，       "</span><span class="token punctuation">,</span>
			<span class="token string">"}"</span><span class="token punctuation">,</span>
			<span class="token string">"",
			""
			""
		],
		"description": "Log output to console"
	}
	//  Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and 
	//  description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope 
	//  is left empty or omitted, the snippet gets applied to all languages. 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": {
	//  	"scope": "javascript,typescript",
	//  	"prefix": "log",
	//  	"body": [
	//  		"console.log('$1');",
	//  		"$2"
	//  	],
	//  	"description": "Log output to console"
	//  }
}

二、VSCodeプラグインの使用
vueテンプレートをすばやく初期化し、この方法を推奨します.欠点:カスタムコードブロックをサポートせず、vueテンプレートの初期化にのみ使用できます.VSCdeプラグイン:vue init biaovをインストールします.vueファイルに「init」と入力し、車に戻ればいいです.
参照先:https://blog.csdn.net/lei_0912/article/details/98867087 (侵入)