如何将 Intellisense 添加到 Visual Studio Code 以进行引导答案

【问题标题】：how to add Intellisense to Visual Studio Code for bootstrap如何将 Intellisense 添加到 Visual Studio Code 以进行引导
【发布时间】：2016-05-14 19:51:47
【问题描述】：

我想专门为 bootstrap 提供智能感知，但即使是我在项目中编写的 css 样式也是如此。我在 project.json 和 bower.json 中有参考，但它们似乎没有提供参考。

【问题讨论】：

标签： visual-studio-code

【解决方案1】：

您可以安装HTML CSS Support Extension。

ext install vscode-html-css

这将在您的 HTML 文件中添加 Intellisense：

你不需要为本地文件配置任何东西，安装后关闭并重新打开 vscode 即可。对于远程 css 文件，您可以添加以下内容

"css.remoteStyleSheets": [
  "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"
]

在settings.json

【讨论】：

是否可以在智能感知中看到图标？例如字体真棒
真的需要VSC的扩展来提供css智能感知吗？！你怎么会知道你需要它，而 css intellisense 不仅仅是一个配置设置？然后你怎么知道要使用哪个扩展？如果您不是 VSC 开发人员的朋友，这似乎完全晦涩难懂且无法使用。如今，同样的问题似乎适用于软件开发领域的所有事情。
这可能在 VScode 更新后不再起作用
可以确认它在撰写此评论时仍然有效。
需要将“css.remoteStyleSheets”改为>>“css.styleSheets”就可以了

【解决方案2】：

以下是在 VS Code 中启用 css IntelliSense 的常用步骤（不仅适用于 Bootstrap）：

第 1 步：转到https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion

或https://marketplace.visualstudio.com/items?itemName=gencer.html-slim-scss-css-class-completion

（安装步骤已经有了）

第 2 步：点击网站顶部的安装按钮（如下截图）

第3步：点击后，浏览器会弹出一个窗口来访问VS Code。用 VS Code 打开它。

第 4 步：再次点击出现在 VS Code 中的“安装”按钮。

第五步：重启软件后，点击下图左下角的图标：

第 6 步：在类引号内按“ctrl+[空格]”，您将从附加的样式表中获得完整的类名。

【讨论】：

一如既往，没有任何效果。我安装了扩展，重新启动了 VSC，点击了 flash，它说“缓存的 CSS/SCSS 类”。在一个 html 文件的编辑器中，我将标签 '
' 编辑为 '
' 将光标放在 " 之间，按住 Ctrl 并按空格键。所有 VSC可以找到“class”、“h1”和“title”。顺便说一句，这些都没有意义。任何实际的类都没有出现。太累了，今天什么都没有用，你 99% 的时间都花在了配置上你永远不会再使用的东西或理解工具。
另外，code.visualstudio.com/docs/editor/intellisense 表示 VSC 将支持 Intellisense for css 开箱即用。但事实并非如此。这一切有多愚蠢？
一直不工作，如果我选择表单 vs 代码建议列表'class'，然后我得到 class=""，接下来我将光标放在 "" 内并输入没有 css 建议，只有当我单击 Ctrl+空格或按空格，如果我删除类名并再次离开“”，当我第一次输入时它会起作用

【解决方案3】：

在最新版本的 VS Code 中，默认情况下禁用了 cmets 和字符串中的 IntelliSense。以下是恢复“24/7 IntelliSense”功能或根据自己的喜好对其进行自定义的两个选项。

首先确保你已经安装了上面dwonisch提到的HTML CSS Support Extension。

Control + ',' 转到设置或单击文件 -> 首选项 -> 设置。

单击工作区设置选项卡并输入以下 JSON 代码：

{
    "editor.quickSuggestions": {
        "comments": false, // <- no 24x7 IntelliSense in comments
        "strings": true, // but in strings and the other parts of source files
        "other": true
    }
}

另一个选项是在 CSS 引号内按 ctrl + 空格来激活智能感知。示例：

<div class="(ctrl+space)"> </div>

【讨论】：

【解决方案4】：

只需添加这 2 个包装就完成了.. !!!

【讨论】：

我是否必须重新启动 vs 代码才能使其工作？
不用重启VS代码就可以正常工作。

【解决方案5】：

只需在 VS Code 中安装此扩展程序即可。 IntelliSense for CSS class names in HTML

【讨论】：

【解决方案6】：

很遗憾，此功能目前在 VS Code 中不可用。但是，它已被添加为即将到来的更新的功能请求。您可以跟踪问题on Github。

【讨论】：

【解决方案7】：

打开 Visual Studio 代码。
使用 CTRL+, 进入工作区设置
在右侧窗口中，您将看到如下内容：
再贴一下这个网址

{
  "folders": [
    {
      "path": "D:\\Visual Studio\\AndreyCourse\\the-complete-web-developer-in-2018\\DocumentObjectModel"
    }
  ],
  "settings": {
    "css.remoteStyleSheets": [
      "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"
    ]
  }
}

享受 Bootstrap Intellisense :-)

【讨论】：

这不起作用，因为没有名为css.remoteStyleSheets 的设置您是否使用了提供此类设置的扩展程序？
@DanielHabenicht 对：marketplace.visualstudio.com/…