创建代码模板，让常用代码有飞一般的感觉

作用

这篇博客主要讲述如何给vscode和idea这两个IDE设置代码模板

代码模板概念

在写代码的时候，有一些代码总是常用的一般都会通过像函数的方式来包装起来，然后反复取用。但是也有一些页面的结构，或者无法封装的套路格式。这个时候代码模板就用上。它可以通过输入短语加快捷键的方式快速写完你设定好的格式。

常用编辑器设置（vscode篇）

打开路径一次为 文件--首选项--用户片段

在这里选中你要设置文件类型相关的json，我们这里以vue为例，选中vue.json

这里的代码含义如下：
"Print to 代码块名称": {
"prefix": "对应触发代码片段的字符",
"body": [
"代码块内容，必须使用双引号引起来",
"此处为光标首次所在: $1",
"此处为光标二次所在: $2" ],
"description": "代码块描述，会在快捷键右侧注释处展示"
}

设置好内容保存即可生效， 然后再vue页面中输入 "prefix"处设置的短语，再按tab键就会出现代码块

常用编辑器设置（IDEA篇）

打开IDEA后，使用快捷键Ctrl+Alt+S 出现“设置” 界面，选中“编辑器”（Editor）——“实时模板”(Live Templates).点击右侧加号(+),选择Templates Group，新增一个“模板”组

填写相应信息，在模板文本中可以使用变量。
abbreviation：缩写，输入缩写快速生成代码。
Description ：模板描述。
Templates text ：模板文本，输出代码。

选出代码模板使用的场景，以后这些代码就可以在这些地方使用了，最后点“确定”完成模板

带需要使用的场景内，输入 模板里定义好的“缩写”内容，再按tab键就出现了代码 ——（完美的代码就这样出现了）

代码模板内容

VUE用：

"Print to console": {
	  "prefix": "vue",
	  "body": [
	
		"",
		"",
		"",
		"",
		"",
		""
	  ],
	  "description": "vue基础界面模板"
	}
  }