linux mint 上 VS 代码中的 Emmet 快捷键建议答案

【问题标题】：Emmet shortcut key suggestion in VS code on linux mintlinux mint 上 VS 代码中的 Emmet 快捷键建议
【发布时间】：2021-10-08 06:58:26
【问题描述】：

我需要关于如何在 Linux mint 上的 VS 代码中编写 emmet HTML 快捷键的建议，如下所示。提前致谢。

   <div><span>span=1</span></div>
  <br>
  <div><span>span=2</span></div>
  <br>
  <div><span>span=3</span></div>
  <br>
  <div><span>span=4</span></div>
  <br>
  <div><span>span=5</span></div>
  <br>

【问题讨论】：

标签： html linux visual-studio-code keyboard-shortcuts emmet

【解决方案1】：

我不知道如何创建一个“emmet”命令，但你可以创建一个 html sn-p 来完成同样的事情。点击Preferences->User Snippets->html，它应该会在编辑器中打开一个名为 html.json 的文件。

您可以将以下内容添加到该 html.json 文件中：

"emmet spans": {
        "prefix": "e-span",
        "body": [
            "<div><span>span=1</span></div>",
            "<br>",
            "<div><span>span=2</span></div>",
            "<br>",
            "<div><span>span=3</span></div>",
            "<br>",
            "<div><span>span=4</span></div>",
            "<br>",
            "<div><span>span=5</span></div>",
            "<br>"
        ],
        "description": "5 spans with line breaks"
    }

一个工作示例 sn-p 文件如下所示：

{
    // Place your snippets for html here. Each snippet is defined under a snippet name and has a prefix, body and 
    // description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
    // $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
    // same ids are connected.
    // Example:
    // "Print to console": {
    //  "prefix": "log",
    //  "body": [
    //      "console.log('$1');",
    //      "$2"
    //  ],
    //  "description": "Log output to console"
    // }
    "emmet spans": {
        "prefix": "e-span",
        "body": [
            "<div><span>span=1</span></div>",
            "<br>",
            "<div><span>span=2</span></div>",
            "<br>",
            "<div><span>span=3</span></div>",
            "<br>",
            "<div><span>span=4</span></div>",
            "<br>",
            "<div><span>span=5</span></div>",
            "<br>"
        ],
        "description": "5 spans with line breaks"
    }
}

保存该文件后，您应该能够编辑 .html 文件，并且当您键入 e-span 时，html sn-p 将添加到您的 .html 文件中。

【讨论】：

感谢您的建议，但我仍在寻找emmet快捷键。