Vscode设置用户代码片段

1. 打开Vscode: 文件->首选项->用户片段

   

2. 点击用户片段，选择vue.json或者新建全局代码片段文件

   

3. 随后会打开一个json文件设置，可直接将以下代码粘贴复制到自己的文件中(步骤：ctrl+A->ctrl+C->ctrl+V),代码写在最下面了，可直接复制

   

4. 配置的代码块代码

5. 代码

   {
   	// 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.
   	"Print to console": {
   		"prefix": "vue2",
   		"body": [
   			"<template>",
   			"<div>",
   			"</div>",
   			"</template>",
   			"<script>",
   			// 导入组件
   			// import Header from "./header.vue";
   			// 导出模块
   			"export default {",
   			// 模块名字
   			"name: 'template',",
   			// 模块数据
   			"data() {",
   			//数据  
   			"return {}",
   			"},",
   			// 注册组件
   			"components: {",
   			// "Header"
   			"},",
   			// 监听指定值，只有指定值变化，才会触发
   			"watch: {},",
   			// 里面的函数只有调用才会执行（实时计算）里面是定义的方法
   			"methods: {",
   			"},",
   			// 创建前状态(里面是操作)
   			"beforeCreate() {},",
   			// 创建完毕状态(里面是操作)
   			"created() {},",
   			// 挂载前状态(里面是操作)
   			"beforeMount() {},",
   			// 挂载结束状态(里面是操作)
   			"mounted() {},",
   			// 更新前状态(里面是操作)
   			"beforeUpdate() {},",
   			// 更新完成状态(里面是操作)
   			"updated() {},",
   			// 销毁前状态(里面是操作)
   			"beforeDestroy() {},",
   			// 销毁完成状态(里面是操作)
   			"destroyed() {},",
   			"};",
   			"</script>",
   			// scoped 样式只在本组件使用
   			"<style scoped>",
   			/**
   			* 导入css样式组件
   			* @import "../styles/header/index.css";
   			*/
   			"</style>"
   		],
   		"description": "Log output to console"
   	}
   }

6. 创作不易，点个赞再走呗