Tailwind CSS 編輯器支持

編輯器支持

在使用 Tailwind CSS 時(shí)可以改善開發(fā)人員體驗(yàn)的插件和配置設(shè)置。

語法支持

Tailwind CSS 使用許多自定義 CSS 規(guī)則，例如 ?@tailwind?、?@apply? 和 ?@screen?，在許多編輯器中，這可能會(huì)在無法識(shí)別這些規(guī)則的情況下觸發(fā)警告或錯(cuò)誤。

解決這個(gè)問題的方法幾乎總是為您的編輯器/IDE 安裝一個(gè)插件來支持 PostCSS 語言，而不是常規(guī)的 CSS。例如，VS Code 有一個(gè) PostCSS 語言支持插件，你可以使用它與 Tailwind CSS 配合得很好。

在某些情況下，如果您的編輯器對(duì) CSS 文件中預(yù)期的語法非常嚴(yán)格，您可能需要禁用原生 CSS linting/validations。

適用于VS代碼的IntelliSense

用于Visual Studio Code的官方Tailwind CSS IntelliSense擴(kuò)展，通過為用戶提供自動(dòng)完成、語法高亮和提示等高級(jí)功能，增強(qiáng)了Tailwind的開發(fā)體驗(yàn)。

• 自動(dòng)完成。對(duì)類名以及 CSS 函數(shù)和指令的智能建議。
• 檢查語法錯(cuò)誤。突出顯示 CSS 和標(biāo)記中的錯(cuò)誤和潛在錯(cuò)誤。
• 懸停預(yù)覽。將鼠標(biāo)懸停在 Tailwind 類名稱上，查看完整的 CSS。
• 語法高亮。提供語法定義，以便正確突出顯示 Tailwind 功能。

查看 GitHub 上的項(xiàng)目以了解更多信息，或?qū)⑵涮砑拥?nbsp;Visual Studio Code 以立即開始。

JetBrains IDE

WebStorm、PhpStorm 等 JetBrains IDE 包括在您的 HTML 中和使用 ?@apply? 時(shí)對(duì)智能 Tailwind CSS 完成的支持。

詳細(xì)了解 JetBrains IDE 中的 Tailwind CSS 支持