vscode 自定义vue代码字段

最新推荐文章于 2025-06-11 16:33:07 发布

冰魂破

最新推荐文章于 2025-06-11 16:33:07 发布

阅读量356

点赞数

CC 4.0 BY-SA版权

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/ks8380/article/details/102955178

vue 专栏收录该内容

21 篇文章

订阅专栏

本文介绍如何在编辑器中配置Vue.js代码片段，通过修改vue.json文件，实现快速创建.vue页面模板，提升开发效率。

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

路径：文件---首选项--用户代码字段搜索vue.json 如下图所示

进入vue.json 文件会出现如下的注释代码

代码如下：

	"demo": {
		"prefix": "vhtml",
		"body": [
				"<template>",
				" <div class=\"$1\">",
				" ",
				" </div>",
				"</template>",
				" ",
				"<script>",
				"export default {",
				" name: '',",
				" data () {",
					" return {",
					
					" }",
				" }",
				"}",
				"</script>",
				" ",
				"<style scoped lang = \"less\">",
				" ",
				"</style>"
		],
		"description": "模板代码"
	}
}

新建一个.vue页面输入 vhtml 会出现如下：