如何修复由 sass / scss 引起的 css stylelint 错误？

Question

我使用 Sass(scss) 作为我的项目的 css 预处理器。但是当我运行sass 编译的stylelint文件时.css，它返回很多错误，您无法直接在.css文件中修复这些错误，因为这些文件是由 sass 编译的。sass 重新编译 css 文件后，您更改的任何内容都将丢失。

我使用了各种 sass linting 选项，例如sass-lint和 ，sass-lint-auto-fix但是这些选项虽然有用，但并没有解决文件中的问题.css。

stylelint还不断将各种 sass @-rules 标记@mixin为@include意外和未知的 at-rules。

欢迎任何建议或想法。谢谢。

Answer 1

但是当我对.csssass 编译的文件运行 stylelint 时，它返回很多错误，您无法直接在.css

linter 支持类似 CSS 的语法，如 SCSS、Sass、Less 和 SugarSS，以及从 HTML、markdown 和 CSS-in-JS 对象和模板文本中提取嵌入样式。

您应该在 SCSS 源代码文件上运行 stylelint，而不是编译后的 CSS 文件：

stylelint "**/*.scss"

stylelint 还不断将各种 sass @-rules（如 @mixin 和 @include）标记为意外和未知的 at-rules。

stylelint 中内置的规则适用于标准 CSS。和@mixinat@includes规则是非标准的，因为它们是 SCSS 而不是 CSS 的一部分，因此它们被标记为未知。但是，stylelint-scss 插件包包含特定于 SCSS 和类似 SCSS 的语法的规则。您可以通过扩展配置文件中的stylelint -config-recommended-scss可共享配置来使用它：.stylelintrc.json

{
  "extends": ["stylelint-config-recommended-scss"],
  "rules": {}
}