如何更改 VS 代码中的基本 html 结构？答案

【问题标题】：How to change the basic html structure in VS code?如何更改 VS 代码中的基本 html 结构？
【发布时间】：2022-11-21 01:20:22
【问题描述】：

我想更改加载有 [! + tab] 或 [ctrl + space]

当我按下 [!标签]：

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

我想将其设置为例如：

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">    
    <link rel='stylesheet' type='text/css' media='screen' href='main.css'>
    <title>Document</title>

</head>
<body>
    
</body>
</html>

我试着查看 html sn-ps 参数，但没有找到任何东西。

【问题讨论】：

这回答了你的问题了吗？ How to edit existing VS Code Snippets

标签： html visual-studio-code

【解决方案1】：

我无法发表评论，因为我没有足够的声誉。
这是你可以做你想做的事情的方式，不能输入所有内容所以这里是 youtube 链接https://youtu.be/ePNT21D3d2M
他描述了最简单的方法。请观看视频，它只有大约 10 分钟。我自己看过它并添加了自定义sn-p（emmet）

【讨论】：

【解决方案2】：

至覆盖现存的埃米特在 VS 代码中：

创建一个 snippets.json 文件，添加这个 JSON 结构和节省它在你硬盘上的某个地方。

 {
  "html": {
   "snippets": {
     "!": "{<!DOCTYPE html>}+html[lang='fr']>(head>meta:utf+meta:vp+title{${2:Document}}+link[rel='stylesheet' type='text/css' media='screen' href='main.css'])+body"
   }
 },
 "css": {
   "snippets": {}
 }
}

打开 VS 代码设置 (代码 → 首选项 → 设置) 并搜索“Emmet 扩展路径”。
1. 点击“添加项目”，输入您之前创建的 snippets.json 文件所在文件夹的路径，然后按“确定”。
现在试试[！ +标签];)

要了解有关自定义 sn-ps 工作原理的更多信息，请查看this文章

【讨论】：