VSCode设置vue模板

_MadD

于 2020-08-17 19:55:16 发布

阅读量570

点赞数

CC 4.0 BY-SA版权

分类专栏： # vue基础知识文章标签： visual studio code

本文链接：https://blog.youkuaiyun.com/weixin_45849112/article/details/108063057

vue基础知识专栏收录该内容

18 篇文章

订阅专栏

本文介绍如何在VSCode中快速设置Vue组件模板，通过首选项中的用户代码片段功能，自定义并编辑.vue文件的代码模板，提高前端开发效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

VSCode设置vue模板

文件 => 首选项 => user snippet
然后输入vue，选择vue-html.json
在这里插入图片描述
然后编辑模板，保存

// An highlighted block
 "Print to console": {
		"prefix": "vue",
		"body": [
			"<template>",
			"  <div>",
			"    $0",
			"  </div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  data () {",
			"    return {",
			"    }",
			"  },",
			"",
			"  components: {},",
			"",
			"  methods: {}",
			"}",
			"</script>",
			"",
			"<style scoped>",
			"</style>"
		],
		"description": "Log output to console"
	}

在这里插入图片描述