如何将@tailwindCSS规则添加到css检查器

Tailwind@tailwind在规则中添加了css,标记为未知.我怎样才能避免这个错误？

例如 styles.css

@tailwind preflight;

@tailwind utilities;

这是由vscode的内置列表提供的规则不可知的规则.

为了摆脱它,你需要做以下事情:

1.安装stylelint扩展code --install-extension shinnn.stylelint

2.安装stylelint推荐配置npm install stylelint-config-recommended --save-dev

3.在vscode USER SETTINGS中添加这两行

"css.validate": false, // Disable css built-in lint
"stylelint.enable": true, // Enable sytlelint

4.将这些行粘贴到.stylelintrc项目根目录中调用的文件中,如果它不存在则创建它.有关stylelint配置的更多信息,请访问以下链接:https://stylelint.io/user-guide/

{
  "extends": "stylelint-config-recommended",
  "rules": {
    "at-rule-no-unknown": [ true, {
      "ignoreAtRules": [
        "extends",
        "tailwind"
      ]
    }],
    "block-no-empty": null,
    "unit-whitelist": ["em", "rem", "s"]
  }
}

我的建议是安装postCSS语言支持，然后重命名tailwind.css为，tailwind.pcss然后将package.json脚本（或用于顺风的任何构建脚本）中的引用更改为tailwind.pcssfrom，tailwind.css并且一切正常。

@apply规则与postCSS兼容：https : //github.com/tailwindcss/tailwindcss/issues/325