设置一个vue文件的全局模板

发布时间:2023年12月18日

VsCode在新建一个.vue文件的时候是空白的,需要我们自己输入片段,可这些在每次新建.vue文件都需要自己手敲,所以创建一个模板方便使用

设置vue模板

1

2

导入

{
	"生成 vue 模板": {
	"prefix": "vue",
	"body": [
	"<template>",
	"<div></div>",
	"</template>",
	"",
	"<script>",
	"//这里可以导入其他文件(比如:组件,工具 js,第三方插件 js,json文件,图片文件等等)",
	"//例如:import 《组件名称》 from '《组件路径》';",
	"",
	"export default {",
	"//import 引入的组件需要注入到对象中才能使用",
	"components: {},",
	"props: {},",
	"data() {",
	"//这里存放数据",
	"return {",
	"",
	"};",
	"},",
	"//计算属性 类似于 data 概念",
	"computed: {},",
	"//监控 data 中的数据变化",
	"watch: {},",
	"//方法集合",
	"methods: {",
	"",
	"},",
	"//生命周期 - 创建完成(可以访问当前 this 实例)",
	"created() {",
	"",
	"},",
	"//生命周期 - 挂载完成(可以访问 DOM 元素)",
	"mounted() {",
	"",
	"},",
	"beforeCreate() {}, //生命周期 - 创建之前",
	"beforeMount() {}, //生命周期 - 挂载之前",
	"beforeUpdate() {}, //生命周期 - 更新之前",
	"updated() {}, //生命周期 - 更新之后",
	"beforeDestroy() {}, //生命周期 - 销毁之前",
	"destroyed() {}, //生命周期 - 销毁完成",
	"activated() {}, //如果页面有 keep-alive 缓存功能,这个函数会触发",
	"}",
	"</script>",
	"<style scoped>",
	"$4",
	"</style>"
	],
	"description": "生成 vue 模板"
	}
	

测试

新建一个.vue文件
输入vue敲回车,会直接出现模板示例,到时候不需要的片段删除即可。

文章来源:https://blog.csdn.net/m0_58503202/article/details/134975697
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。