标签: stylelint

任何人都知道使用样式组件时获得 VSCode stylelint 自动修复的任何插件或任何方法吗？

我正在从头开始使用 TypeScript 和样式组件设置一个 React 项目。我之前已经这样做过，并且在之前的项目中，VS Code Stylelint 扩展效果非常好。

但是，在我的新项目中，我无法让它在.ts文件中工作.tsx。它仍然可以在文件中工作.js。我的设置与我之前的项目完全相同，所以我真的很困惑为什么它不起作用。

我已经在 VS Code Github 存储库中提出了一个问题，但它立即被关闭。该扩展本身已禁用打开任何问题的可能性。

一些屏幕截图来说明我的观点：

.js在文件 中工作的 Stylelint

.tsStylelint 在文件 中不起作用

.ts在另一个项目的文件 中工作的 Stylelint

如果您需要有关我的配置或任何内容的更多信息，请告诉我。任何帮助是极大的赞赏

编辑：看起来作者已经删除了扩展..

是否可以忽略我的CSS路径,因为我只使用stylelint进行SCSS验证？

例如 - 我有以下结构:

assets/
    css/
    scss/

如何通过css/VSCode的settings.json文件禁用索引文件夹？

我在文档中找到了这个,但我不知道如何在VSCode中实现它.

你会推荐哪一个，Sass-lint或Style-lint？为什么？（他们似乎和我很相似）

我正在尝试使用 stylelint 一次检查多个目录。

在我的package.json文件中我有：

"scripts": {
  "lint": "stylelint 'pages/**/*.scss', 'global/components/**/*.scss' ; exit 0"
},

如果我删除 或'pages/**/*.scss'，'global/components/**/*.scss'我可以检查其中一个目录。

是否可以同时 lint 2 个？

我查看了 stylelint 的文档，只看到了一种禁用 stylelint 以在特定文件/目录上运行的方法，但我真正想要的是一种禁用特定文件/目录的特定规则的方法。有没有办法实现这一目标？我不想stylelint-disable在文件中使用。

我使用 husky 和 ​​lint-staged 在具有此配置的 sass 文件上运行“stylelint --fix”

"husky": {\n    "hooks": {\n        "pre-commit": "lint-staged",\n        "post-commit": "git update-index --again"\n    }\n},\n"lint-staged": {\n    "resources/sass/*.scss": [\n        "stylelint --fix",\n        "git add"\n    ]\n}\n

PhpStorm 阻止了我的提交并告诉我：

Commit failed with error, 0 file committed, 4 files failed to commit: test lintstaged husky > pre-commit (node v12.18.4) \xe2\x9a\xa0 Some of your tasks use `git add` command. Please remove it from the config since all modifications made by tasks will be automatically added to the git commit …

在一个项目中，我们有自定义模板字符串来抽象样式组件功能。例如，我们有媒体查询的模板字符串，如下所示：

// Definition
const for1080p = (...args) => css`
  @media (min-height: 1080px) {
    ${css(...args)}
  }
`;

// Usage
const Logo = styled.div`
  width: 200px;

  ${for1080p`
    width: 300px;
  `}
`;

我们做出这个选择是因为它保留了原始样式的语法。它也由 prettier 很好地格式化。

我们今天的主要问题是我们不知道如何使用 stylelint 分析自定义模板字符串中的 CSS。

例如：

const Logo = styled.div`
  widht: 200px; /* <--- Unexpected unknown property "widht" */

  ${for1080p`
    widht: 300px; /* <--- No error detected :( */
  `}
`;

你知道怎么做吗？

我正在使用stylelint和eslint，我刚刚提到可以单击eslint中的一行来直接在 IDE 中打开文件并跳转到所选行。

我想知道是否可以向stylelint添加类似的功能，因为默认情况下这是不可能的：

我已经尝试解决这个问题，但我找不到感觉良好的曲目。你能推荐一种方法来做到这一点吗？这是应该直接在stylelint源代码中更改的东西还是应该将其编写为插件？如果是，是否有任何插件已经修改了我可以用作示例/参考的消息？或者这个功能是否已经存在，但我只是不知道如何启用它？

我自己的另一个想法是将 的输出通过管道/传递stylelint到另一个脚本，然后能够使用一些正则表达式用超链接替换行，如Terminal - create hyperlinks中所述，但我认为应该有一种不那么老套的方法来解决这。

期待一些我应该深入挖掘的提示，谢谢您的建议！

我是 Stylelint 的新手。我试图理解文档并搜索了 GitHub，但所有解释都充满了双重否定，我很困惑！
问题是，当我使用//注释时，它会抛出Unknown word (CssSyntaxError)Stylelint(CssSyntaxError).

例子：

我该如何解决这个问题，或者禁用注释行上的 Stylelint 检查？