标签导航:

如何在 VSCode 中为 React 组件启用 Tailwind CSS 提示?

在 vscode 中为 react 组件启用 tailwind css 提示

如果你在使用 vscode 编写 react 组件时,发现 tailwind css 提示无法正常显示,这里有一个解决方法:

  1. 安装 tailwind css intellisense 插件

这是实现代码提示的关键,确保你已经安装了此插件。

  1. 将 tailwind css 包含到项目中

根据你的项目设置,你可以使用 npm 或 yarn 安装 tailwind 依赖。

  1. 针对 react 组件添加插件设置

在 vscode 设置中,导航到“用户设置”或“工作区设置”(具体取决于项目范围)。添加以下 json 片段:

{
  "tailwindCSS.experimental.showSuggestionsFor": [
    "strings"
  ],
  "tailwindCSS.includeLanguages": [
    "javascript",
    "typescript",
    "jsx-typescript"
  ]
}
  1. 重启 vscode

重启 vscode 以应用更改。

  1. 检查提示

现在,在 react 组件中编写 tailwind css 时,你应该能够看到 css 提示。

参考信息:

请注意,此处的参考信息已从问答中删除。