Vue template method generated by vscode with one click

Configure vue template

method one:

insert image description here
insert image description here

Method 2: Ctrl + shift + P shortcut key to open the configuration window, enter "user", find "Configure User Snippets" (configure user code snippets)

insert image description here
insert image description here

After entering the file name, press Enter to generate a "*.json.code" file, add the code template you need in the file

Template example:

"prefix" - - - The name of the generated template, custom, you can write something easy to remember (enter the string and press Enter to generate a defined template)
"body" - - - The code template to be generated

Note: "body" configuration item - - - double quotes outside, single quotes inside, in turn will report an error

Assign the corresponding code template according to your actual needs~

{
    
    
   "Print to console": {
    
    
    	"prefix": "vue3",
    	"body": [
    		"<script setup lang='ts'>",
    		"import { ref, reactive } from 'vue'",
        	"",
        	"</script>",
        	"",
        	"<template>",
        	"  <div></div>",
        	"</template>",
        	"",
        	"<style lang='scss' scoped>",
        	"",
       		"</style>",
    	],
    	"description": "Log output to console"
    }
}

Quickly generate vue template method

Enter the code template name "vue3" configured above, and press Enter to quickly generate a vue template

insert image description here
insert image description here

Guess you like

Origin blog.csdn.net/qq_39111074/article/details/131394110