今天，我们发布了 适用于 Visual Studio Code 的 Tailwind CSS IntelliSense 扩展 的新版本，它为你的 CSS 和标记添加了 Tailwind 特定的 linting 功能。
¥Today we’re releasing a new version of the Tailwind CSS IntelliSense extension for Visual Studio Code that adds Tailwind-specific linting to both your CSS and your markup.
检测 CSS 中的错误(Detecting errors in your CSS)
¥Detecting errors in your CSS
Tailwind 已经可以检测 CSS 错误，例如，当你在 @screen 指令中输入错误的屏幕名称时。Tailwind CSS IntelliSense 的 linting 功能会直接在你的编辑器中显示这些错误，并结合上下文进行显示。linter 将验证你的 @tailwind、@screen、@variants 和 @apply 指令，以及任何 theme 函数调用：
¥Tailwind already detects CSS errors, for example when you mistype a screen name in the @screen directive. The linting feature for Tailwind CSS IntelliSense surfaces these errors and displays them in context, directly inside your editor. The linter will validate your @tailwind, @screen, @variants and @apply directives, as well as any theme function calls:
捕获 HTML 中的冲突(Catching conflicts in your HTML)
¥Catching conflicts in your HTML
还有一条 lint 规则，它会分析模板文件中的类列表，并高亮任何实用程序似乎存在冲突的实例。例如，你可能不想将 mt-4 和 mt-6 放在同一个类列表中！
¥There is one more lint rule which analyses class lists in your template files and highlights any instances where utilities seem to be in conflict. For example you probably didn’t intend to have mt-4 and mt-6 in the same class list!
包含快速修复(Quick fixes included)
¥Quick fixes included
为了尽可能轻松地修复任何问题，所有 lint 规则都有自己的 "快速修复" 操作，可以直接在 Visual Studio Code 中触发。如果你不小心输入了 @screen small 而不是 @screen sm，编辑器会自动将 small 替换为 sm！
¥To make it as easy as possible to fix any issues, all of the lint rules have their own "quick fixes" which can be triggered directly within Visual Studio Code. If you accidentally typed @screen small instead of @screen sm, the editor can automatically replace small with sm for you!
除了简单的文本替换外，我们还针对更复杂的 lint 规则提供了一些更有趣的快速修复。看看扩展如何自动重构无效的 @apply 指令：
¥As well as simple text replacements there’s also some more interesting quick fixes for the more complex lint rules. Take a look at how the extension can automatically refactor an invalid @apply directive:
配置(Configuration)
¥Configuration
我们相信你会喜欢新的 lint 功能，但如果你不喜欢，或者你只是想调整一些行为，我们也能满足你的要求。你可以决定如何处理每条规则违规：是 error，还是仅仅是 warning，或者你想把规则完全 ignore 化？如果你真的想禁用 linting，可以使用新的 tailwindCSS.validate 设置完全禁用。
¥We think you’ll love the new lint feature, but if you don’t, or you just want to tweak some behavior, we’ve got you covered. You can decide how each rule violation is treated: is it an error, or just a warning, or do you want to ignore the rule altogether? If you really want to you can disable linting entirely using the new tailwindCSS.validate setting.
查看 扩展程序自述文件 了解如何配置 lint 规则以适合你的工作流程的更多详细信息。
¥Check out the extension readme for more details about configuring the lint rules to suit your workflow.
结论(Conclusion)
¥Conclusion
Linting 现已在 Tailwind CSS IntelliSense 的 v0.4.0 版本中可用！如果你已经安装了该扩展，则可能需要重新加载 Visual Studio Code 才能获取更新；如果没有，则可以通过 扩展程序市场 安装。
¥Linting is available now in v0.4.0 of Tailwind CSS IntelliSense! If you already have the extension you may need to reload Visual Studio Code to get the update, and if you don’t you can install it via the extension marketplace.
这是此功能的首次迭代，我们期待你的反馈！你对新的 lint 规则有什么想法吗？告诉我们！
¥This is the very first iteration of this feature, and we’d love to hear your feedback! Do you have an idea for a new lint rule? Let us know!
想要讨论这篇文章吗？Discuss this on GitHub →
¥Want to talk about this post? Discuss this on GitHub →