Question

我正在使用grunt-jsbeautifier来打印.css文件，并使用grunt-contrib-csslint检查.css文件是否存在问题。不幸的是，美化器似乎产生了违反短绒规则的CSS。

如果我有这个CSS：

.half_circle_style a:nth-child(2) {}

...然后grunt-contrib-csslint报告“完成，没有错误”。

如果我通过grunt-jsbeautifier运行CSS，则会在nth-child之前添加一个空格：

.half_circle_style a: nth-child(2) {}

...导致grunt-contrib-csslint报告：

[L1:C23]
>> Expected LBRACE at line 1, col 23. This rule looks for recoverable syntax errors. (errors)
[L1:C23]
>> Unexpected token 'nth-child(' at line 1, col 23. This rule looks for recoverable syntax errors. (errors)
[L1:C33]
>> Unexpected token '2' at line 1, col 33. This rule looks for recoverable syntax errors. (errors)
[L1:C34]
>> Unexpected token ')' at line 1, col 34. This rule looks for recoverable syntax errors. (errors)
[L1:C36]
>> Unexpected token '{' at line 1, col 36. This rule looks for recoverable syntax errors. (errors)
[L1:C37]
>> Unexpected token '}' at line 1, col 37. This rule looks for recoverable syntax errors. (errors)

我不是CSS专家，所以我正在寻找一个专家意见，请 - grunt-jsbeautifier相当糟糕，或者是grunt-contrib-csslint是否过于严格？

Answer 1

在这种情况下，我不相信grunt-contrib-csslint过于严格。

.half_circle_style a:nth-child(2) {}

是有效的CSS语法，而

.half_circle_style a: nth-child(2) {}

（nth-child之前的空格）是无效的CSS语法。

问题可能是因为你通过JavaScript美化引擎运行你的CSS而不是CSS美发引擎？也许您可以尝试通过http://cssbeautify.com/

运行代码

CSS - linter与美化不一致

1 个答案: