In vscode, when creating a new HTML page, you can enter the key! + tab to quickly generate the HTML code template. The default generated code template is as follows:
<!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>
Because some of the generated code templates are unnecessary, they need to be deleted after each generation, which is very troublesome. In fact, we can modify the default generated HTML code template.
Operation steps:
1. Find expand in the vscode installation directory- full.js file
The path is
VScode\resources\app\extensions\emmet\node_modules\vscode-emmet- helper\out\expand\expand-full.js
2. Search Lang with editor
Find the following code areas
"!!!": "{<!DOCTYPE html>}",
"doc": "html[lang=${lang}]>(head>meta[charset=${charset}]+meta:vp+meta:edge+title{${1:Document}})+body",
"!|html:5": "!!!+doc",Revised as
"!!!": "{<!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. Restart vscode
When you enter the! + Tab key again, the code template generated by default has been changed, as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
This article introduces the method of vscode modifying the default generated HTML template. For more relevant vscode modifying HTML template content, please search the previous articles of developeppaer or continue to browse the related articles below. I hope you can support developeppaer more in the future!