在vs code 中如何创建一个自己的 Vue 模板代码

站长资源 2024/11/25 佚名

2 0 1

首先，在vs code 中打开定义模板代码的地方

第一步，点击“设置”图标按钮，在弹出的菜单中点击的“用户代码片段”（也就是模板）

第二步，在弹出的框中选择新建代码片段（可选为全局/现在的项目创建模板）

第三步，输入要新建的模板名称，然后，回车（这里我已经新建过了）

然后会自动打开下面这个页面，在这里我们就可以开始新建一个vue模板了

现在我们开始创建我们的模板了这是一个模板例子

需要的可以直接拷贝到新建的模板文件中，然后按自己的风格改改

{
	"Print to console": {    
		"prefix": "vue",    
		"body": [     
				"<template>",     
				" <div class=\"$TM_FILENAME_BASE\">",
				"  ${0}",
				" </div>",    
				"</template>",     
				"",
				"<script>",    
				"export default {",
				" name: '$TM_FILENAME_BASE',",
				" data () {",
				"  return {",
				"",
				"  };",
				" },",
				" methods: {}",
				"}",
				"</script>",
				"",
				"<style lang='scss' scoped>",
				"",
				"</style>"
		],
		"description": "my vue template"
	}
}

模板文件中各参数的含义