vscode code template (vue3 template) enter vue3 to display code prompts

Approach 1: Open in sequence in vscode: [File] --> [Preferences] --> [Configure User Code Snippet] --> [New Code Snippet]

Approach 2: Or click the setting button in the lower left corner to find it (as shown below)

 Then click vue.json

 If it has not been set, it will look like the picture below; if it has been configured, it should also know the next steps

Paste the following code

{
	// Place your snippets for vue 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", //log为快捷名称
	// 	"body": [
	// 		"console.log('$1');",//body中就是输入快捷名称并且选择时快捷生成的代码模板
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }
	"Print to console": {
		"prefix": "vue3",
		"body": [
		  "<template>",
		  "  <div></div>",
		  "</template>",
		  "",
		  "<script setup>",
		  "import { ref, reactive, getCurrentInstance } from 'vue';",
		  "const { proxy } = getCurrentInstance()",

		  "</script>",
		  "",
		  "<style scoped lang='scss'>",


		  "</style>"
		],
		"description": "Log output to console"
	  }

}

Shortcut key: ctrl+s; save the file and use it

When we choose vue3, we can quickly generate the code in the body of the code template, as shown below

 

This is done;

Just to record the problems in the study