VScode修改默认生成的HTML模板的方法

所属分类: 网络编程 / 相关技巧 阅读数: 535
收藏 0 赞 0 分享

在VScode中,新建HTML页面时可以输入!+tab键,快速生成HTML代码模板,默认生成的代码模板如下:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Document</title>
</head>
<body> 
</body>
</html>

由于生成的代码模板中有一些不需要,所以每次生成后都需要删除,很麻烦。其实我们可以修改默认生成的HTML代码模板。

操作步骤:

1.找到VScode安装目录下的expand-full.js文件

路径为

VScode\resources\app\extensions\emmet\node_modules\vscode-emmet- helper\out\expand\expand-full.js

2.利用编辑器搜索lang

找到下列代码区域

 "!!!": "{<!DOCTYPE html>}",
 "doc": "html[lang=${lang}]>(head>meta[charset=${charset}]+meta:vp+meta:edge+title{${1:Document}})+body",
 "!|html:5": "!!!+doc",

修改为

 "!!!": "{<!DOCTYPE html>}",
 // "doc": "html[lang=${lang}]>(head>meta[charset=${charset}]+meta:vp+meta:edge+title{${1:Document}})+body",
 "doc": "html>(head>meta[charset=${charset}]+title{${1:Document}})+body",
 "!|html:5": "!!!+doc",

3.重启VScode

再次输入!+tab键时,此时默认生成的代码模板已更改,如下:

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Document</title>
</head>
<body>
</body>
</html>
更多精彩内容其他人还在看

Git 2.27.0详细安装步骤详解

这篇文章主要介绍了Git 2.27.0详细安装步骤,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

利用git提交代码的方法步骤

这篇文章主要介绍了利用git提交代码的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

Windows 系统下的 Git 2.7 最新下载及安装教程图文详解

这篇文章主要介绍了Windows 系统下的 Git 2.7 最新下载及安装教程,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

git clone 子模块没下载全的问题解决

这篇文章主要介绍了git clone 子模块没下载全的问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

git中submodule子模块的添加、使用和删除的示例代码

这篇文章主要介绍了git中submodule子模块的添加、使用和删除的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

如何用idea+gitee来团队合作开发项目的教程

这篇文章主要介绍了如何用idea+gitee来团队合作开发项目,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

vscode配置setting.json文件实现eslint自动格式代码

这篇文章主要介绍了vscode配置setting.json文件实现eslint自动格式代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

AES加密算法的原理详解与实现分析

这篇文章主要介绍了高级加密标准(AES,Advanced Encryption Standard)为最常见的对称加密算法(微信小程序加密传输就是用这个加密算法的)。对称加密算法也就是加密和解密用相同的密钥,需要的朋友可以参考下
收藏 0 赞 0 分享

JetBrains(IEDA、CLion、Pycharm) 学生获得免费使用资格

JetBrains针对学生推出了免费使用资格,但是很多同学却不知道或者说不知道怎样获得免费资格,通过学生认证来使用JetBrains的软件才是最方便稳定的,具体怎么获取呢,感兴趣的朋友跟随小编一起看看吧
收藏 0 赞 0 分享

Clion、IEDA、pycharm的一些简单设置步骤(设置中文菜单、输出中文、字体大小、背景颜色主题)

这篇文章主要介绍了Clion、IEDA、pycharm的一些简单设置步骤(设置中文菜单、输出中文、字体大小、背景颜色主题),本文通过图文并茂的形式给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多