VSCode 自定义html模板

前言: 在code时，希望使用快捷键，快速构建模板，不仅可以提供工作效率，而且也丰富了编码的乐趣。

VSCode 自定义html模板

- - - 第一步: 找到 html.json 文件
    - 第二步: 添加html模板
    - 第三步:使用自定义的快捷键快速创建模板

第一步: 找到 html.json 文件

打开vscode → 设置 → 选择User Snippets
搜索 html.json 文件

第二步: 添加html模板

在 html.json 文件中自定义html模板

代码块如下:

"h5 template": {
		"prefix": "vv", // 这个模板的快捷键
		"body": [
		 "<!DOCTYPE html>",
		 "<html lang=\"en\">",
		 "<head>",
		 "\t<meta charset=\"UTF-8\">",
		 "\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
		 "\t<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">",
		 "\t<title>Document</title>",
		 "</head>\n",
		 "<body>",
		 "\t<div id =\"app\"> </div>\n",
		 "\t<script src=\"https://cdn.jsdelivr/npm/vue/dist/vue.js\"></script>  <!-- vue 路径-->",
		 "\t<script>",
		 "\t //创建Vue实例,得到 ViewModel",
		 "\t const vm = new Vue({",
		 "\t\tel: '#app',",
		 "\t\tdata: {},",
		 "\t\tmethods: {}",
		 "\t });",
		 "\t</script>",
		 "</body>\n",
		 "</html>"
		],
		"description": "HT-H5" // 模板的描述
 	}