vsCode快速生成模板

最新推荐文章于 2026-04-22 11:39:55 发布

原创最新推荐文章于 2026-04-22 11:39:55 发布 · 2.5k 阅读

4 ·

本内容遵循CC 4.0 BY-SA版权协议

萌

标签

#visual studio code

收录于

工具专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何在编辑器中配置Vue文件的代码片段，通过设置用户片段和安装Vuter插件，实现快速创建标准结构的Vue组件。输入特定前缀并按下Tab或Enter键即可自动生成完整的Vue模板。

1、文件->首选项->用户片段
2、如果新建vue模板，就输入vue搜索vue.json如图
在这里插入图片描述
vue.json文件中放如下内容

{
	"Print to console": {
		// 前缀  也就是用户输入的快捷键内容
		"prefix": "vue",
		// 输出内容
		"body": [
			"<template>",
			"  <div>",
			"",
			"  </div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  data () {",
			"    return {",
			"    }",
			"  }",
			"}",
			"</script>",
			"",
			"<style  scoped>",
			"",
			"</style>",
			""
		],
		// 描述
		"description": "Log output to console"
	}
}