在vscode 中设置 vue模板内容的方法

vscode中设置 vue 模板内容缘由设置要求1：vscode 先下载插件 `vetur`2: 菜单栏 -文件 - 首选项 - 用户代码片段3：使用

缘由

由于每次在 vscode 中创建vue的文件的时候，都需要手动书写
templete，模板
script，脚本
style，样式
这些重复和繁琐的事情，是可以定义一个模板信息的

设置要求

1：vscode 先下载插件 vetur

2: 菜单栏 -文件 - 首选项 - 用户代码片段

以下是借鉴一下谷粒商城的 提供 vue 模板信息 和 httpget、httppost请求

{
	"生成vue模板": {
		"prefix": "vue",
		"body": [
			"",
			"",
			"",
			"",
			"$4",
			""
		],
		"description": "生成vue模板"
	},
	"http-get请求": {
	"prefix": "httpget",
	"body": [
		"this.\$http({",
		"url: this.\$http.adornUrl(''),",
		"method: 'get',",
		"params: this.\$http.adornParams({})",
		"}).then(({ data }) => {",
		"})"
	],
	"description": "httpGET请求"
 },
 "http-post请求": {
	"prefix": "httppost",
	"body": [
		"this.\$http({",
		"url: this.\$http.adornUrl(''),",
		"method: 'post',",
		"data: this.\$http.adornData(data, false)",
		"}).then(({ data }) => { });" 
	],
	"description": "httpPOST请求"
 }
}

3：使用

在新创建的vue文件中，根据刚才的文件名就可以快速生成模板中的文件内容

比如，此时就是设置的 vue

总结

到此这篇关于在vscode 中设置 vue模板内容的方法的文章就介绍到这了,更多相关vscode 设置 vue模板内容内容请搜索考高分网以前的文章或继续浏览下面的相关文章希望大家以后多多支持考高分网！