成都网站建设设计

将想法与焦点和您一起共享

Vscode中要如何快速创建自定义代码模板的-创新互联

小编给大家分享一下Vscode中要如何快速创建自定义代码模板的,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

创新互联专注于企业成都全网营销、网站重做改版、沽源网站定制设计、自适应品牌网站建设、H5开发成都做商城网站、集团公司官网建设、外贸营销网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为沽源等各大城市提供网站开发制作服务。

Vscode中快速创建自定义代码模板

一招鲜,吃遍天,学会了这个在Vscode中快速创建自定义代码模板的教程,我相信创建其它代码模板的方法你也就通个七七八八了。

我就以Vue的创建为例,不过我这个Vue是在HTML中创建的。

  • 初学Vue,我们一般都是在.html文件中引入vue包,然后编写自己的vue代码。
  • 盲目的跟着网上那些教程创建Vue模板是行不通的。
  • 因为我们创建的模板是在.html文件下,所以我们的模板也得是在html.json中来进行编写。

教程如下:

图文并用,理解更清晰到位!

在Vscode中找到设置 -> 用户代码片段,在输入框内输入html,并点击第一个html.json

Vscode中要如何快速创建自定义代码模板的

初次输入的话,第一个html.json可能会不带.json后缀,不用管,直接点击html进入即可。

我们进入到html.json页面,这里就是我们编写自己模板的地方了:

Vscode中要如何快速创建自定义代码模板的

接下里就是编写我们的模板了,我们的模板需要的大致有以下几项:

1.基本的HTML架构。
2.引入Vue包的script路径。
3.一些基本的Vue代码结构。

模板我已经备好了,模板如下:

"Html5-Vue": {
	"prefix": "vue",
	"body": [
		"",
		"\n",
		"",
		"\t",
		"\t",
		"\t",
		"\tDocument",
		"\t",
		"\n",
		"",
		"\t
$1
\n", "\t", "\n", "" ], "description": "快速创建在html5编写的vue模板" }

新闻名称:Vscode中要如何快速创建自定义代码模板的-创新互联
新闻来源:http://chengdu.cdxwcx.cn/article/dosggo.html