10vue学习——利用VScode快速创建html模板

10vue学习——利用VScode快速创建html模板

前言

我们在做项目的时候，有时候会需要用到很多次相同的代码，这样子多次的编写相同的代码不止浪费时间，还特别的枯燥无味。这时候我们就会想要编写一份可以多次利用的模板，接下来让我们来看看怎么做吧！

步骤

（1） 按 Ctrl + Shift + P 键后弹出搜索框——>在搜索框中输入 snippet ——>选择“首选项：配置用户代码片段”——>选择输入框下面的选项（新建 全局/特定文件夹下的代码片段文件）——>在输入框输入自定义的文件名后按enter键生成文件。结果如下图：

（2）在生成的文件中将下面的代码复制进去

{
	"h5 sample": {
		"prefix": "len",
		"body": [
			"",
			"",
			"",
				"\t",
				"\t",
				"\t",
				"\t",
			"",
			"",
				"\t
",
				"\t
",
				"\t",
				"\t",
			"",
			""
		  
		],
		"description": "The full sample code - html5."
	  }

结果如下：

（1）prefix 中的值是你自定义的，当你输入该值后按tab键时就会自动生成该模板
（2）$0 是创建完毕之后光标所在的位置，便于自己编写个性化的字段

（3）新建一个html文件，输入prefix中自定义的值，如我的是“len”，后按tab键便会自动生成相关代码了：