vscode vue代码片段

1、文件
2、首选项
3、用户片段
4、新建代码片段
这里我创建的文件是vue.json

{
	// 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",
	// 	"body": [
	// 		"console.log('$1');",
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }
	"Print to console": {
		"prefix": "vue",
		"body": [
			"<template>",
			"    <div>\n",
			"    </div>",
			"</template>\n",
			"<script>",
			"export default {",
			"    name:'name',",
			"    props: {\n",
			"    },",
			"    data () {",
			"        return {\n",
			"        };",
			"    },",
			"    components: {\n",
			"    },",
			"    mounted () {\n",
			"    },",
			"    methods: {\n",
			"    },",
			"};",
			"</script>\n",
			"<style lang='scss' scoped>\n",
			"</style>\n",
		],
		"description": "Create vue template"
	},
	"set vuestyle": { // 片段名称
		"prefix": "sty", // 输入style触发联想提升
		"body": [ // 确认后添加的代码
			"<style lang='scss' scoped>",
			"$0", // $0代表光标最后停留的位置
			"</style>"
		],
		"description": "set_style" // 
	},
	"create vuex": { // 创建vuex仓库
		"prefix": "vuex", // 输入vuex触发联想提升
		"body": [ // 确认后添加的代码
			"export default new Vue.Store({",
			"    state: {",
			"       count:666",
			"    },",
			"    getters: {\n",
			"    },",
			"    mutations: {\n",
			"    },",
			"    actions: {\n",
			"    },",
			"});",
		],
		"description": "create_vuex" // 
	},
	"create store": { // 创建vuex仓库
		"prefix": "ck", // 输入vuex触发联想提升
		"body": [ // 确认后添加的代码
			"import state from './state.js'",
			"import getters from './getters.js'",
			"import mutations from './mutations.js'",
			"import actions from './actions.js'",
			"export default new Vuex.Store({",
			"    state,",
			"    getters,",
			"    mutations,",
			"    actions,",
			"});",
		],
		"description": "create_vuex" // 
	},
	"Angle brackets": { //尖括号
		"prefix": "ls",
		"body": [
			"<template$0 />"
		],
		"description": "Create vue Angle brackets"
	}
}