如何为Tailwind CSS配置Stylelint检查？-css教程-PHP中文网

@apply被标红是因为stylelint默认只识别标准css at-rules，需通过at-rule-no-unknown的ignoreatrules选项白名单声明"apply"等tailwind指令；scss项目还需配置scss/at-rule-no-unknown并安装stylelint-scss等配套插件。

如何为tailwind css配置stylelint检查？

为什么`@apply`总被标红？

这不是你写错了，是 Stylelint 默认不认识 Tailwind 的 @apply、@tailwind、@variants 这些指令。它只认标准 CSS at-rules（比如 @media、@import），遇到未知的就报 Unknown at rule @apply。

关键不是关掉整个规则，而是告诉 Stylelint：“这些 at-rule 是合法的，别拦着”。否则要么满屏红波浪线，要么粗暴禁用 at-rule-no-unknown，导致真正拼错的 @midea 也逃过检查。

必须用 at-rule-no-unknown 规则的 ignoreAtRules 选项，不能直接设为 null
如果项目同时用 SCSS，还要额外配 scss/at-rule-no-unknown，否则 SCSS 文件里照样报错
ignoreAtRules 列表要包含所有实际用到的 Tailwind 指令：至少 "apply"、"tailwind"、"variants"，加 "responsive" 和 "screen" 更稳妥

`stylelint.config.js` 必须这样导出

Stylelint 不会自动向上找配置，也不支持 ESM 的 export default（尤其在 Umi 或老版 Webpack 环境下）。配置文件名必须是 stylelint.config.js 或 .stylelintrc.js，且只能用 CommonJS 导出。

使用HTML,CSS,JavaScript开发Android应用程序英文文字pdf版附源文件

如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更

下载

正确写法：module.exports = { extends: [...], rules: {...} }
错误写法：export default {...} 或 export const config = {...}
如果用了 stylelint-webpack-plugin，插件内部 require 配置时只认 module.exports，ESM 会直接报 Cannot use import statement

SCSS + Tailwind 组合要装对插件

只装 stylelint 和 stylelint-config-standard 是不够的。SCSS 语法解析、Tailwind 指令识别、规则覆盖，三者缺一不可。

必须安装：stylelint-scss（解析 SCSS）、stylelint-config-standard-scss（SCSS 专用规则集）
如果跳过 stylelint-config-standard-scss，stylelint-scss 插件加载后反而可能触发更多 unknown word 报错
推荐 extends 写法：["stylelint-config-standard", "stylelint-config-standard-scss"]，再通过 plugins: ["stylelint-scss"] 启用插件
注意版本对齐：Stylelint v15 需搭配 stylelint-scss@4+，v14 对应 @3.x，混用会 silent fail

VS Code 里不提示？检查语言绑定

VS Code 的 Stylelint 插件默认只校验 .css 和 .scss 文件，但如果你在 .vue 或 .astro 的 <style></style> 块里写 Tailwind，它根本不会运行。

在 VS Code 设置里搜 stylelint.validate，手动加上 "vue"、"svelte"、"astro" 等语言 ID
确保文件后缀和语言模式匹配：比如 .vue 文件右下角显示的是 Vue 而非 HTML，否则插件不触发
如果用 Volar（Vue 3），还需确认 stylelint.validate 包含 "postcss" —— Vue 单文件组件的 style 块默认走 postcss 解析器