为什么 stylelint 只用一个 css class 让我的非常简单的文件失败

Question

我刚刚在一个看起来像这样的文件上遇到了两个 stylelint 错误

.link {
  position: absolute;
  top: var(--spacing-l);
  left: var(--spacing-fluid-l);
  z-index: 2;
  color: var(--color-white);
  appearance: none;
  white-space: nowrap;
  composes: nav-bold from '~@tv2/ui-ng/styles/typography.module.css';
  text-decoration: none;
  display: inherit;

  &:hover {
    color: var(--color-white);
  }

}

.icon {
  color: var(--color-white);
  height: 20px;
  width: auto;
  margin-right: 5px;
  margin-top: 4px;

  & > svg {
    height: 20px;
    width: auto;
    margin-right: 5px;
    margin-top: 4px;
  }
}

错误是

 1:1  ✖  Unknown rule no-invalid-position-at-import-rule  no-invalid-position-at-import-rule
 1:1  ✖  Unknown rule no-irregular-whitespace             no-irregular-whitespace

查看 no-invalid-position-at-import-rule https://stylelint.io/user-guide/rules/no-invalid-position-at-import-rule none 似乎适用于我的代码。

但我当然想制作最小的可重现示例。

所以我做了以下内容：

.link {
  position: absolute;
}

手写，以免出现任何不良类型的空格。

运行带命令 yarn stylelint path-to-file 的 stylelint 回来了

 1:1  ✖  Unknown rule no-invalid-position-at-import-rule  no-invalid-position-at-import-rule
 1:1  ✖  Unknown rule no-irregular-whitespace             no-irregular-whitespace

我的系统是macCatalina，intel芯片，node版本v14.16.1，stylelint版本13.12.0，yarn版本2.4.1

问题有点含蓄，但要准确地说出来 - 为什么 stylelint 会抛出这两个错误，而文件似乎没有这些错误，如果文件有错误，我该如何修复文件。

Answer 1

所以 - 当它说 Unknown rule no-invalid-position-at-import-rule 我太专注于 no-invalid-position-at-import-rule 而我应该专注于它的未知规则部分。

Stylelint 说它不知道这条规则 - 为什么它不知道这条规则？因为我们最近更新了我们的 stylelint 配置而不是我们的 stylelint 版本，所以配置中有一些规则是 stylelint 不知道的。

Answer 2

对于 Visual Studio 代码：卸载 Stylelint 扩展并重新安装，错误应该会消失。

为什么 stylelint 只用一个 css class 让我的非常简单的文件失败

why is stylelint failing my very simple file with just one css class

stylelint