Visual Studio Code 用户片段不起作用答案

【问题标题】：Visual Studio Code user snippets not workingVisual Studio Code 用户片段不起作用
【发布时间】：2017-11-03 09:31:48
【问题描述】：

我已经在 VS Code 中启用了默认的“log”sn-p。我还添加了另一个 sn-p。当我输入它们的前缀时，它们都不会出现。我已将 editor.tabCompletion 设置为 true。

知道为什么这些不起作用吗？

【问题讨论】：

您是否认真遵循了这些步骤？ code.visualstudio.com/docs/editor/userdefinedsnippets 它们是否出现在命令面板的插入片段中？
否 - 它们不会显示在命令面板中。
我也成功添加了log sn-p。但我必须点击两次标签。第一个清除弹出面板，第二个添加sn-p。
当我选择标签时，它会为我输入的任何内容创建开始和结束 HTML 标记。它永远不会在弹出窗口中识别我的代码 sn-ps。
另外，在任何使用“html”表示 sn-ps/emmet 的地方，如果启用了“liquid”和“twig”，请确保包括“liquid”和“twig”，以查看基于 HTML 的项目：CTRL+P > Change Language Mode 并输入 html。我有 3 个列表，它在 Html 中不起作用，因为默认是 html liquid。

标签： visual-studio-code

【解决方案1】：

有几种方法可以解决此问题。问题是 Intellisense 妨碍或默认将您的 sn-ps 置于列表底部。

首先我尝试了建议延迟，但后来我决定让 Intellisense 将我的 sn-ps 放在建议列表的顶部，snippetSuggestions 用户偏好：

{
  "editor.tabCompletion": true,
  "editor.snippetSuggestions": "top"
}

【讨论】：

这解决了我在 Elixir 中的问题。
我也必须在editor.quickSuggestions 中启用other。我想我已经禁用了它，因为一些我不关心的库中有太多垃圾邮件。
谢谢！！我从 Atom 切换过来，在那里我的 sn-ps 总是可以完美运行（即使智能感知无法显示，也可以一直使用它们）。在 VSC 中，我遇到了两个问题：intellisense 并不总是出现（并且当它没有出现时无法使用我的 sn-ps），以及我的 sn-ps 不在顶部。这是一个理智的拯救者。谢谢！

【解决方案2】：

有时最先被忽视的显而易见的事情。在启动 VSCode 并创建一个新文档 (Ctrl + N) 时，可能会令人惊讶的是 sn-ps 不起作用。检查 VSCode 编辑器的右下角，默认情况下会显示“纯文本”文件。使用 sn-ps 将文件类型更改为您喜欢的语言。

这可能会克服一些不必要的故障排除；-)

【讨论】：

这正是我的 HTML emmet sn-ps 无法正常工作的原因。我所有的用户 settings.json 都很好，但是我的 VSCode 编辑器将其预先判断为 Django HTML。将其切换为 HTML，我需要恢复 sn-p 功能。
这对我有帮助。我正在编辑一个 html 文件，但它在右下角将一个 html 文件标识为“Go HTML 模板”文件，常规 html sn-ps 对其不起作用。上面值得注意的是 - 通过单击右下角的“Go HTML 模板”文本（或任何你的文本）来更改文件类型
帮助我将 YAML 与 ansible 关联起来。现在用户 sn-ps 工作。谢谢！
@ImtiazRaqib，我知道这是一条旧评论，但我遇到了和你一样的问题。您可以将“django-html”添加到 sn-p 的范围内，而不是切换到 HTML，"scope": "javascript,html,django-html"。这样你就可以继续使用你的 Django 扩展了。

【解决方案3】：

如果您尝试插入 PHP sn-ps，值得注意的是您必须手动包含

<?php

在 sn-ps 开始工作之前。

【讨论】：

这个。即使文档可能被设置为PHP，那些分配给PHP 的sn-ps 也只有在</php ... ?> 标签中输入前缀时才起作用。有点愚蠢的TBH。
BRB ehm ehm 我想添加一个设置开头<?php 标记的sn-p，这样只需输入ph 并得到提示。虽然它不起作用，使用这个 stackoverflow.com/a/55220696/3446280 ，我创建了一个新的 PHP 文件并输入 ph 或 php 但从一开始就是错误的，因为标签是“abc”而不是方形图标。解决方案是在“新的全局 sn-p 文件...”中创建 sn-p
如果你在 html 中编写 php 并且想要像 <?= $0 ?> 这样的 sn-p 那么你需要将 sn-p 添加到 html.json，而不是 php.json。

【解决方案4】：

为了使用 typescript 做出反应，我必须专门将 'typescriptreact' 添加到范围。

 "scope": "javascript, typescript, typescriptreact"

【讨论】：

就是这样！范围内的“打字稿”无法识别 tsx 文件！
对于 jsx 和 tsx 文件，这个技巧解决了这个问题。其他人都没有为我工作。
我遇到了同样的问题。即使在我尝试使用新的 sn-p 的纯 JavaScript 测试文件中，VS Code 的语言也是javascriptreact，而不是右下角的javascript。我不得不将它移动到一个全局 sn-p 范围为已回答，尽管我必须添加 javascriptreact，因为我没有使用 TypeScript。
这对我有用但似乎范围属性仅在全局 sn-ps 文件中有效。当尝试在javascriptreact.json 中设置"scope": "javascript, javascriptreact" 时（因为我的sn-p 没有申请带有.js 扩展名的文件）VSCode 会警告“不允许使用属性范围”。

【解决方案5】：

我实际发现的是，当你有一个 php intelliSense 并且你想要一个 php 标签标签来打开和关闭时，我也将扩展名添加到了一个 html 文件类型。

   {
      "Open php tag": {
         "scope": "php, html",
         "prefix": "php",
         "body": [
           "<?php",
             "  $1",
           "?>"
        ],
        "description": "Opens php tags"
      }
   }

这对我有用:)

【讨论】：

超级神奇的东西！
请注意，这需要创建一个全局 sn-p - 出于显而易见的原因，当您在特定于语言的文件中指定额外的范围（语言）时会出现错误。

【解决方案6】：

打开一个普通的 html 文件。
查看右下角正在使用插件的位置（例如：Django HTML）并点击它
将在 vscode 顶部打开一个窗口
点击“为.'html'配置文件关联...”
搜索“HTML”（在活动大写锁定中需要这个）
选择第一个选项

【讨论】：

【解决方案7】：

就我而言，它不起作用，因为我在 sn-p 的名称中有一个空格

{
  ...,
  "snippet name": { // it should be snippet_name. Notice the _
    ...
  }
}

所以请确保：

.vscode 文件夹下有一个{name}.code-snippets 文件
您的 sn-p 名称不包含spaces
您将您的语言包含在范围内。我必须同时添加 typescript 和 typescriptreact。

【讨论】：

我没想到“typescript”在 React TypeScript 项目中还不够。因此，添加“typescriptreact”结束了我对 VSC sn-ps 的挫败感。谢谢！
它适用于我的情况。我的名字是：“打印到控制台”：....我替换为“Print_to_console”：它有效！！！谢谢！

【解决方案8】：

选择范围时扩展很重要。我最近从使用 .js 扩展名的反应切换到使用 .tsx 扩展名的打字稿反应。我的 sn-p 说“javascript，typescript”所以我以为我被覆盖了，但 tsx 文件实际上被认为是“typescriptreact”。我更改为以下内容，它开始处理我的 tsx 文件：

{   
    "Styled Component React Arrow Function With Default Export": {
    "scope": "javascript, javascriptreact, typescript, typescriptreact",
    "prefix": "scraf",
    "body": [
        "import React from 'react'",
        "import styled from 'styled-components/macro'",
        "",
        "const Container = styled.div`",
        "  display: flex;",
        "`",
        "",
        "const ${TM_FILENAME_BASE} = () => {",
        "  return (",
        "    <Container>",
        "     $1",
        "    </Container>",
        "  )",
        "}",
        "export default ${TM_FILENAME_BASE}",
    ],
    "description": "Styled Component React Arrow Function With Default Export"
}

【讨论】：

【解决方案9】：

对于那些正在寻找覆盖默认 sn-p (log) 的人

在用户片段中覆盖 log.json 文件 sn-p 对我不起作用（至少对于 Typescript）。

解决方案： 我创建了一个具有不同名称“clog”（全名：“clog.code-sn-ps”）和前缀的新全局 sn-p（文件 > 首选项 > 用户片段 > 新全局片段文件）并且它起作用了。

【讨论】：

【解决方案10】：

我在创建第一个 sn-p 时也遇到了这个问题。我添加了sn-p，没有任何反应。

重新启动 VS Code，它们开始工作了。

【讨论】：

【解决方案11】：

只需重启 VScode。应该没问题。

【讨论】：

【解决方案12】：

我不得不：

进入设置（Windows/Linux：File > Preferences > Settings，macOS：Code > Preferences > Settings）并输入quick在搜索框中并点击 在 settings.json 中编辑：
添加

"editor.quickSuggestions": true

在对应的部分下文件类型（markdown 在我的例子中）：

【讨论】：

【解决方案13】：

我的问题是一些 sn-ps 有效，而另一些则无效。 （比如：JavaScript Snippets 运行良好）

当我安装一个添加了相应的特定文件类型关联的插件时我的问题解决了（我的情况是：*.blade.php）

在 Blade.json 创建 UserSnippets 时效果很好。

检查您的文件扩展名，看看是否有适合您文件类型的插件。
安装并尝试再次添加 sn-p。

【讨论】：

【解决方案14】：

不要忘记在全局 sn-p 中指定语言。就我而言，它已修复。

{
  "Print to console": {
        "scope": "javascript,vuex,vue",
        "prefix": "debes",
        "body": [
            "// eslint-disable-next-line",
            "debugger;"
        ],
        "description": "Log output to console"
    }
}

【讨论】：

【解决方案15】：

将"editor.tabCompletion": true 更改为"editor.tabCompletion":"on" 对我有用。

【讨论】：

【解决方案16】：

我试图设置一个 sn-p 来自动将 php 打开和关闭标签添加到我的文件中，因为 Robert Cooper 指出它仅在我已经在代码特定类型块中编写时才有效。

所以我将!p 设置为在HTML 块中使用它时加载<?php$1?>。 sn-p 被设置到 html.json 文件中。

【讨论】：

【解决方案17】：

如果其他人有这个问题，我正在使用 react native 并且我的 JavaScript sn-ps 无法正常工作。我通过转到设置检查了 settings.json，搜索了快速建议，然后在 settings.json 中进行了编辑。

  "files.associations": {
    "*.js": "javascriptreact" // This needed changed to "javascript".
  }

否则，您可以为 javascriptreact 创建 sn-ps。

【讨论】：

【解决方案18】：

对于其他面临此问题的人，请务必检查 sn-p 中定义的范围。尽管文件类型匹配，但片段没有显示给我，并且从范围中删除语言解决了我的问题。

【讨论】：

【解决方案19】：

此问题的原因是另一种语言在 VS Code 中处于活动状态。检查左下角 VS Code 将语言更改为所需的语言。截图如下。 enter image description here

点击C++，顶部会出现一个输入框。输入适当的语言，例如 HTML，问题就会解决。

enter image description here

【讨论】：

【解决方案20】：

Visual Studio代码如何添加<?php开始标签sn-p

只是为了防止那些想添加方便的<?php开始标签sn-p的人头疼

如果您按照https://code.visualstudio.com/docs/editor/userdefinedsnippets 上的说明进行操作，您会被误导，因为提示您在文件>首选项>用户片段中找到想要的语言

所以你输入 PHP 并编辑 php.json

...但这不起作用，因为该机制仅在 VSCode 编辑器知道这是一个 PHP 文件并且右下角的过滤器看起来不会考虑自己之后才起作用，直到您不添加 <?php在文件的开头

没办法

尽管有文件扩展名

尽管您甚至手动将“选择语言模式”设置为 PHP（尽管文件名中带有 PHP 扩展名，但它已经设置为 PHP 模式）

我发现的唯一解决方案是将 sn-p 添加到“新的全局 sn-p 文件...”

您将首先浏览到此选项文件>首选项>用户片段

这个解决方案很明显......但只有在那之后你才能猜到它:-) 因为你添加了这个全局，

事实上，正如它所暗示的那样，全局中的 sn-p 将“全局地在任何类型的文件类型中工作”

【讨论】：

【解决方案21】：

我最好的策略是在我处理一个大项目时将我的 sn-ps 保存为“全局片段”（.code-sn-ps 格式），这样我就不会遇到任何问题.. 他们总是出现..您的全局 sn-ps 与您的“.json” sn-ps 位于同一文件中..

【讨论】：

【解决方案22】：

我在 VSCode 中的 react 项目遇到了这个问题，然后我编辑了 settings.json。基本上，我在 settings.json 文件中添加了以下几行。

"emmet.includeLanguages": {
    "javascript": "javascriptreact"
}

【讨论】：

【解决方案23】：

就我而言，有人在我不应该使用 sn-ps 的项目中大胆提交：

// .vscode/settings.json
{
  "[go]": {
    "editor.snippetSuggestions": "none",
  },
}

我删除了那行，我的用户设置开始了。

【讨论】：

【解决方案24】：

从 vscode 扩展市场安装 CodeLLDB 平台包。应该可以解决你的问题

【讨论】：