脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → 相关技巧 → VScode修改HTML模板

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

 更新时间：2020年08月06日 09:22:24   作者：IT教育-汤小洋  
这篇文章主要介绍了VScode修改默认生成的HTML模板的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

在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>

到此这篇关于VScode修改默认生成的HTML模板的方法的文章就介绍到这了,更多相关VScode修改HTML模板内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

相关文章

  • 在Git中撤消更改的六种方法总结

    在Git中撤消更改的六种方法总结

    这篇文章主要介绍了Git中常用的6种撤消更改的方法,包括git amend、git reset、git rebase、git revert和git checkout等,通过这些命令,可以方便地处理项目代码管理中的错误操作或需求变更,需要的朋友可以参考下
    2024-12-12
  • VSCode中通过launch.json文件打断点DeBug调试代码详细图文教程

    VSCode中通过launch.json文件打断点DeBug调试代码详细图文教程

    在VSCode中launch.json是用于配置调试器的文件,它定义了调试会话的各种设置,下面这篇文章主要给大家介绍了关于VSCode中通过launch.json文件打断点DeBug调试代码的详细图文教程,需要的朋友可以参考下
    2024-08-08
  • 有效的提高编程技能的12个方法

    有效的提高编程技能的12个方法

    以下是提高编程技能的12个方法，主要是不停学习，努力成全才，跟聪明人或有想法的一起
    2012-05-05
  • 小项目中管理npm包版本的思路与方法

    小项目中管理npm包版本的思路与方法

    这篇文章主要给大家介绍了关于小项目中该如何管理npm包版本的思路与方法,npm包版本管理是非常重要的，文章通过示例代码介绍的很详细,需要的朋友可以参考下
    2021-06-06
  • github 生成token的方法图解

    github 生成token的方法图解

    这篇文章主要介绍了github 生成token的方法，本文通过图文并茂的形式给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友参考下吧
    2020-09-09
  • conda常用命令整理及用法详解

    conda常用命令整理及用法详解

    这篇文章主要为大家介绍了conda常用命令整理及用法详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-01-01
  • Git中smart Checkout与force checkout的区别及说明

    Git中smart Checkout与force checkout的区别及说明

    这篇文章主要介绍了Git中smart Checkout与force checkout的区别及说明，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
    2022-08-08
  • 为Jenkins创建定时构建任务

    为Jenkins创建定时构建任务

    这篇文章介绍了为Jenkins创建定时构建任务的方法，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2022-03-03
  • 在 git 中取消 __pycache__ 文件的方法

    在 git 中取消 __pycache__ 文件的方法

    _pycache__ 文件夹是 Python 编译器用来存放编译后的 Python 文件的，在项目中不需要提交这些文件，因为它们可以通过编译源代码重新生成，这篇文章主要介绍了如何在 git 中取消 __pycache__ 文件,需要的朋友可以参考下
    2023-01-01
  • OB系统变量Variables及ODC管理会话功能详解

    OB系统变量Variables及ODC管理会话功能详解

    这篇文章主要为大家介绍了OB系统变量Variables及ODC管理会话功能详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2022-12-12

最新评论