- 新增三个 demo 工程(demo-eslint / demo-sqlfluff / demo-stylelint):各含 src/ 样例代码与覆盖率映射(run-coverage.mjs、coverage_map.json、stylelint_line_map.json) - 归档各 demo 的插件实测导出报告(reports/): - demo-eslint:common.js / esm-demo.js / legacysyntax.cjs / typescript.ts 审查报告 + 覆盖率报告(292/292 条零偏差,126 种规则全覆盖) - demo-sqlfluff:11 个 SQL 样例审查报告 + 覆盖率报告(113/113 条零偏差,57 种规则全覆盖,含 JJ01 行号缺陷修复后的复测验证) - demo-stylelint:common.css / empty-source.css 审查报告 + 覆盖率报告(145/145 条零偏差,68 种规则全覆盖)
473 lines
27 KiB
Markdown
473 lines
27 KiB
Markdown
# 代码审查报告
|
|
|
|
**文件:** `data\demo-stylelint\src\common.css`
|
|
**语言:** css
|
|
**耗时:** 218.1s
|
|
**分析工具:** stylelint
|
|
|
|
---
|
|
|
|
总计: 150 | 错误: 145 | 警告: 4 | 建议: 1
|
|
|
|
静态分析 · 144 个问题
|
|
|
|
- 🔴 `stylelint:import-notation` L6
|
|
应使用字符串形式导入,而不是 url()。
|
|
建议: 将 @import url("/x.css") 改为 @import "/x.css";。
|
|
- 🔴 `stylelint:color-named` L9
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:no-invalid-position-at-import-rule` L13
|
|
@import 规则位置非法(位于其他规则之后)。
|
|
建议: 将所有 @import 规则移到其他样式规则之前。如果使用构建工具,应改用 link 标签或合并导入文件。
|
|
- 🔴 `stylelint:at-rule-descriptor-no-unknown` L18
|
|
@font-face 中使用了未知描述符“unknown-descriptor”。
|
|
建议: 删除 unknown-descriptor,或将其替换为合法的 @font-face 描述符,例如 font-family、src、font-weight。
|
|
- 🔴 `stylelint:at-rule-descriptor-value-no-unknown` L23
|
|
字体描述符 font-display 的取值“invalid-display-value”非法。
|
|
建议: 使用合法的 font-display 值,如 auto、block、swap、fallback、optional。建议改为 font-display: swap;。
|
|
- 🔴 `stylelint:at-rule-no-deprecated` L27
|
|
已废弃的 @ 规则“@viewport”。
|
|
建议: 不要再使用 @viewport,改用 viewport meta 标签或现代 CSS 视口单位方案;直接删除该规则。
|
|
- 🔴 `stylelint:at-rule-no-unknown` L32
|
|
未知的 @ 规则“@unknown-rule”。
|
|
建议: 删除该未知规则,或改为有意义的规则,例如 @media 或 @supports。
|
|
- 🔴 `stylelint:block-no-empty` L32
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:at-rule-prelude-no-invalid` L36
|
|
@layer 规则的 prelude“foo.bar.”无效。
|
|
建议: 层名称不能以点结尾,应改为合法的层名称,如 foo.bar。
|
|
- 🔴 `stylelint:block-no-empty` L36
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:at-rule-no-vendor-prefix` L40
|
|
使用了带厂商前缀的 @ 规则“@-webkit-keyframes”。
|
|
建议: 去掉厂商前缀,并使用标准 @keyframes;若需兼容旧浏览器,可在标准规则旁保留前缀版本。
|
|
- 🔴 `stylelint:block-no-empty` L40
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:block-no-empty` L45
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:media-feature-name-no-unknown` L45
|
|
未知媒体特性“unknown-feature”。
|
|
建议: 使用有效的媒体特性,如 min-width、max-width、orientation。
|
|
- 🔴 `stylelint:block-no-empty` L49
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:media-feature-name-value-no-unknown` L49
|
|
媒体特性 width 的值“10”未知。
|
|
建议: 媒体查询中的长度值需要单位,改为 10px。
|
|
- 🔴 `stylelint:block-no-empty` L53
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:media-query-no-invalid` L53
|
|
无效的媒体查询“(min-width: )”。
|
|
建议: 补全媒体特性的值,如 min-width: 100px。
|
|
- 🔴 `stylelint:block-no-empty` L57
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:media-type-no-deprecated` L57
|
|
已废弃的媒体类型“tv”。
|
|
建议: 改为 screen 或移除该媒体查询。
|
|
- 🔴 `stylelint:block-no-empty` L61
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:media-feature-name-no-vendor-prefix` L61
|
|
带厂商前缀的媒体特性名。
|
|
建议: 使用标准 min-resolution 替代 -webkit-min-device-pixel-ratio。
|
|
- 🔴 `stylelint:block-no-empty` L65
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:no-unknown-custom-media` L65
|
|
使用了未定义的自定义媒体查询“--my-custom-media”。
|
|
建议: 先用 @custom-media 定义,或改用标准媒体查询替代。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L70
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:annotation-no-unknown` L71
|
|
未知注解“!foo”。
|
|
建议: 删除 !foo,只保留 color: red。
|
|
- 🔴 `stylelint:color-named` L71
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L71
|
|
无法解析属性 color 的值“red !foo”。
|
|
建议: 删除 !foo,color 的值应为合法颜色。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L75
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:color-no-invalid-hex` L77
|
|
非法十六进制颜色“#12345”。
|
|
建议: 十六进制颜色必须是 3、4、6 或 8 位,改为 #123456 或 #123。
|
|
- 🔴 `stylelint:declaration-block-no-duplicate-properties` L77
|
|
重复的属性“color”。
|
|
建议: 同一规则块中只能有一个 color 声明,删除多余声明。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L77
|
|
属性 color 的值“#12345”未知。
|
|
建议: 使用合法的十六进制颜色,如 #123456。
|
|
- 🔴 `stylelint:color-hex-length` L80
|
|
十六进制颜色过长,应缩短。
|
|
建议: 将 #ffffff 缩写为 #fff。
|
|
- 🔴 `stylelint:color-function-notation` L83
|
|
应使用现代颜色函数记号。
|
|
建议: 使用空格分隔的现代语法,例如 rgb(255 0 0)。
|
|
- 🔴 `stylelint:alpha-value-notation` L86
|
|
预计将“50%”改为“0.5”。
|
|
建议: alpha 通道值应使用 0~1 的数字,将 rgba(0, 0, 0, 50%) 改为 rgba(0, 0, 0, 0.5)。
|
|
- 🔴 `stylelint:color-function-notation` L86
|
|
应使用现代颜色函数记号。
|
|
建议: 使用空格分隔的现代语法,例如 rgba(0 0 0 / 0.5)。
|
|
- 🔴 `stylelint:color-function-notation` L89
|
|
应使用现代颜色函数记号。
|
|
建议: 使用空格分隔的现代语法,例如 hsl(120deg 50% 50%)。
|
|
- 🔴 `stylelint:hue-degree-notation` L89
|
|
色相值“120”应使用角度表示“120deg”。
|
|
建议: 在 hsl/hwb 等颜色函数的色相值后添加 deg。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L93
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:color-named` L95
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:comment-no-empty` L100
|
|
空注释。
|
|
建议: 删除空注释,或在注释内添加说明文字。
|
|
- 🔴 `stylelint:comment-whitespace-inside` L100
|
|
注释内“/*”后应有空格。
|
|
建议: 在注释内部加上空格,例如 /* comment */。
|
|
- 🔴 `stylelint:comment-whitespace-inside` L100
|
|
注释内“*/”前应有空格。
|
|
建议: 在注释内部加上空格,例如 /* comment */。
|
|
- 🔴 `stylelint:comment-whitespace-inside` L103
|
|
注释内“/*”后应有空格。
|
|
建议: 在注释内容两侧加空格,例如 /* comment */。
|
|
- 🔴 `stylelint:comment-whitespace-inside` L103
|
|
注释内“*/”前应有空格。
|
|
建议: 在注释内容两侧加空格,例如 /* comment */。
|
|
- 🔴 `stylelint:no-invalid-double-slash-comments` L106
|
|
非法的双斜杠 CSS 注释。
|
|
建议: CSS 不支持 // 注释,改为 /* */ 注释或删除该行。
|
|
- 🔴 `stylelint:color-named` L109
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:color-named` L114
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L117
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:custom-property-no-missing-var-function` L119
|
|
自定义属性“--my-color”缺少 var() 函数。
|
|
建议: 使用 var() 包裹自定义属性,如 color: var(--my-color);。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L119
|
|
属性 color 的值“--my-color”未知。
|
|
建议: 应该使用 var(--my-color) 取自定义属性值。
|
|
- 🔴 `stylelint:declaration-block-no-duplicate-custom-properties` L123
|
|
重复的自定义属性“--dup”。
|
|
建议: 删除重复的自定义属性声明,只保留一个 --dup。
|
|
- 🔴 `stylelint:no-unknown-custom-properties` L126
|
|
使用了未定义的自定义属性“--unknown-prop”。
|
|
建议: 先在根或作用域内定义 --unknown-prop,或使用其他已定义的自定义属性。
|
|
- 🔴 `stylelint:import-notation` L131
|
|
应使用字符串形式导入,而不是 url()。
|
|
建议: 将 @import url("/a.css") 改为 @import "/a.css";。
|
|
- 🔴 `stylelint:no-invalid-position-at-import-rule` L131
|
|
@import 规则位置非法(位于其他规则之后)。
|
|
建议: 将所有 @import 规则移到其他样式规则之前。如果使用构建工具,应改用 link 标签或合并导入文件。
|
|
- 🔴 `stylelint:import-notation` L132
|
|
应使用字符串形式导入,而不是 url()。
|
|
建议: 将 @import url("/a.css") 改为 @import "/a.css";。
|
|
- 🔴 `stylelint:no-duplicate-at-import-rules` L132
|
|
重复的 @import 规则“/a.css”。
|
|
建议: 删除重复的 @import。
|
|
- 🔴 `stylelint:no-invalid-position-at-import-rule` L132
|
|
@import 规则位置非法(位于其他规则之后)。
|
|
建议: 将所有 @import 规则移到其他样式规则之前。如果使用构建工具,应改用 link 标签或合并导入文件。
|
|
- 🔴 `stylelint:color-named` L136
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:no-descending-specificity` L138
|
|
低特异性选择器“.bar .foo”应放在高特异性选择器“#high .foo”之前。
|
|
建议: 将 .bar .foo 规则移到 #high .foo 规则之前,避免特异性顺序混乱。
|
|
- 🔴 `stylelint:color-named` L139
|
|
不允许使用命名颜色“blue”。
|
|
建议: 改用十六进制或颜色函数,如 #00f。
|
|
- 🔴 `stylelint:color-named` L144
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L146
|
|
重复的选择器“.dup”,首次使用在第 143 行。
|
|
建议: 合并两个 .dup 规则块。
|
|
- 🔴 `stylelint:color-named` L147
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:color-named` L152
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:declaration-block-no-duplicate-properties` L152
|
|
重复的属性“color”。
|
|
建议: 删除其中的一个 color 声明,避免覆盖。
|
|
- 🔴 `stylelint:color-named` L153
|
|
不允许使用命名颜色“blue”。
|
|
建议: 改用十六进制或颜色函数,如 #00f。
|
|
- 🔴 `stylelint:color-named` L158
|
|
不允许使用命名颜色“blue”。
|
|
建议: 改用十六进制或颜色函数,如 #00f。
|
|
- 🔴 `stylelint:color-named` L159
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:declaration-block-no-shorthand-property-overrides` L159
|
|
简写属性“background”覆盖了“background-color”。
|
|
建议: 避免被覆盖,删除 background-color 或调整顺序。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L163
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:font-family-no-duplicate-names` L165
|
|
字体族名“Arial”重复。
|
|
建议: 删除重复的 Arial,或换成其他字体族名。
|
|
- 🔴 `stylelint:font-family-no-missing-generic-family-keyword` L165
|
|
缺少通用字体族关键字。
|
|
建议: 在字体族列表末尾添加通用族,如 sans-serif、serif、monospace。
|
|
- 🔴 `stylelint:font-family-no-missing-generic-family-keyword` L168
|
|
缺少通用字体族关键字。
|
|
建议: 添加通用族,如 font-family: Arial, sans-serif;。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L173
|
|
属性 font-family 的值“2Fancy”未知。
|
|
建议: 给字体名加引号,例如 font-family: "2Fancy";。
|
|
- 🔴 `stylelint:font-family-name-quotes` L173
|
|
字体名“2Fancy”应加引号。
|
|
建议: 以数字开头的字体名必须用引号包裹:"2Fancy"。
|
|
- 🔴 `stylelint:font-family-no-missing-generic-family-keyword` L173
|
|
缺少通用字体族关键字。
|
|
建议: 添加通用族,如 font-family: "2Fancy", sans-serif;。
|
|
- 🔴 `stylelint:unit-no-unknown` L173
|
|
未知单位“Fancy”。
|
|
建议: 这实际上是字体名 2Fancy 被误解析为数字+单位;应该用引号包裹:"2Fancy"。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L177
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L179
|
|
属性 color 的值“unknown-func()”未知。
|
|
建议: 使用合法的颜色函数,如 rgb()、hsl(),或定义自定义函数不是 CSS 标准。
|
|
- 🔴 `stylelint:function-no-unknown` L179
|
|
未知函数“unknown-func”。
|
|
建议: 使用 CSS 标准函数替换,或移除该声明。
|
|
- 🔴 `stylelint:function-calc-no-unspaced-operator` L182
|
|
calc 表达式中的“+”运算符前应有空格。
|
|
建议: 在 + 两侧添加空格:calc(1px + 2px)。
|
|
- 🔴 `stylelint:function-calc-no-unspaced-operator` L182
|
|
calc 表达式中的“+”运算符后应有空格。
|
|
建议: 在 + 两侧添加空格:calc(1px + 2px)。
|
|
- 🔴 `stylelint:color-named` L185
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:color-named` L185
|
|
不允许使用命名颜色“blue”。
|
|
建议: 改用十六进制或颜色函数,如 #00f。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L185
|
|
属性 background 的值“linear-gradient(top, red, blue)”未知。
|
|
建议: 方向应使用 to bottom 语法,并避免命名颜色:linear-gradient(to bottom, #f00, #00f)。
|
|
- 🔴 `stylelint:function-linear-gradient-no-nonstandard-direction` L185
|
|
线性渐变使用了非标准方向。
|
|
建议: 使用 to bottom 替代 top,表示从顶部到底部。
|
|
- 🔴 `stylelint:no-unknown-animations` L188
|
|
未知动画“my-anim”。
|
|
建议: 为 my-anim 添加 @keyframes 定义,或修改 animation 名称。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L193
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:named-grid-areas-no-invalid` L196
|
|
命名网格区域每个字符串的单元格数量不一致。
|
|
建议: 调整网格区域字符串,使每行单元格数量相同。
|
|
- 🔴 `stylelint:keyframe-selector-notation` L202
|
|
应使用百分比选择器“0%”替代“from”。
|
|
建议: 将 from 改为 0%。
|
|
- 🔴 `stylelint:keyframe-block-no-duplicate-selectors` L205
|
|
关键帧块内重复的选择器“from”。
|
|
建议: 合并两个 from 块,保留一个。
|
|
- 🔴 `stylelint:keyframe-selector-notation` L205
|
|
应使用百分比选择器“0%”替代“from”。
|
|
建议: 将 from 改为 0%。
|
|
- 🔴 `stylelint:keyframe-selector-notation` L212
|
|
应使用百分比选择器“0%”替代“from”。
|
|
建议: 将 from 改为 0%。
|
|
- 🔴 `stylelint:keyframe-declaration-no-important` L213
|
|
关键帧声明中不允许使用 !important。
|
|
建议: 删除 !important。
|
|
- 🔴 `stylelint:keyframe-selector-notation` L219
|
|
应使用百分比选择器“0%”替代“from”。
|
|
建议: 将 from 改为 0%。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L225
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:length-zero-no-unit` L227
|
|
长度为 0 时不应带单位。
|
|
建议: 将 0px 改为 0。
|
|
- 🔴 `stylelint:number-max-precision` L230
|
|
数值精度超过 4 位,期望“1.1235”。
|
|
建议: 将 1.123456 四舍五入为 1.1235。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L233
|
|
重复的选择器“b”,首次使用在第 171 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L235
|
|
属性 width 的值“10unknown”未知。
|
|
建议: 10unknown 不是合法长度,请改为 10px、10rem 等有效值。
|
|
- 🔴 `stylelint:unit-no-unknown` L235
|
|
未知单位“unknown”。
|
|
建议: 10unknown 不是合法长度,改为 10px 或 10rem 等。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L239
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:color-named` L240
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:block-no-redundant-nested-style-rules` L242
|
|
冗余嵌套样式规则。
|
|
建议: 删除无意义的嵌套 & 块,因为外层 a 已经设置了相同样式。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L242
|
|
重复的选择器“&”,首次使用在第 8 行。
|
|
建议: 嵌套选择器 & 不能视为独立选择器,应删除冗余嵌套块。
|
|
- 🔴 `stylelint:color-named` L243
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:nesting-selector-no-missing-scoping-root` L249
|
|
缺少嵌套作用域根,顶层出现了嵌套选择器“&”。
|
|
建议: 将 &:hover 放入某个选择器内部,或改为普通选择器 a:hover。
|
|
- 🔴 `stylelint:color-named` L250
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:color-named` L255
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:no-invalid-position-declaration` L255
|
|
声明位置非法(位于 @media 块内但没有选择器)。
|
|
建议: 将 color: red; 放入一个选择器内部,或删除该声明。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L259
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:color-named` L261
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:property-no-unknown` L261
|
|
未知属性“colour”。
|
|
建议: CSS 中没有 colour,应改为 color。
|
|
- 🔴 `stylelint:property-no-deprecated` L264
|
|
已废弃的属性“word-wrap”。
|
|
建议: 改用标准属性 overflow-wrap。
|
|
- 🔴 `stylelint:property-no-vendor-prefix` L267
|
|
带厂商前缀的属性“-webkit-transform”。
|
|
建议: 使用标准 transform 属性,无需前缀。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L270
|
|
属性 width 的值“unknownvalue”未知。
|
|
建议: width 不接受未定义关键字,请改用 auto、百分比、长度等。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L273
|
|
重复的选择器“b”,首次使用在第 171 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:declaration-property-value-keyword-no-deprecated` L275
|
|
废弃的颜色关键字“activeborder”应替换为“ButtonBorder”。
|
|
建议: 使用系统颜色关键字 ButtonBorder,替换 activeborder。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L279
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:declaration-block-no-redundant-longhand-properties` L282
|
|
冗余的长手写属性“margin-top”位于简写属性“margin”之后。
|
|
建议: 删除冗余的 margin-top,因为 margin: 1px; 已设置所有边距。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L285
|
|
重复的选择器“b”,首次使用在第 171 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:shorthand-property-no-redundant-values` L287
|
|
简写值冗余,期望“1px”。
|
|
建议: margin: 1px 1px 1px 1px 可以简写为 margin: 1px;。
|
|
- 🔴 `stylelint:block-no-empty` L292
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:selector-pseudo-class-no-unknown` L292
|
|
未知伪类选择器“:unknown-pseudo”。
|
|
建议: 使用合法的伪类,如 :hover、:focus、:first-child,或删除该规则。
|
|
- 🔴 `stylelint:block-no-empty` L296
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:selector-pseudo-element-no-unknown` L296
|
|
未知伪元素“::unknown-element”。
|
|
建议: 使用合法的伪元素,如 ::before、::after、::placeholder,或删除该规则。
|
|
- 🔴 `stylelint:block-no-empty` L300
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:selector-pseudo-element-colon-notation` L300
|
|
伪元素应使用双冒号写法。
|
|
建议: 将 :before 改为 ::before。
|
|
- 🔴 `stylelint:block-no-empty` L304
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:selector-type-no-unknown` L304
|
|
未知元素类型“unknowntag”。
|
|
建议: 使用合法的 HTML 标签,或为自定义元素添加连字符(如 unknown-tag)并确保已在 HTML 中注册。
|
|
- 🔴 `stylelint:block-no-empty` L308
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:selector-no-vendor-prefix` L308
|
|
带厂商前缀的选择器“::-webkit-input-placeholder”。
|
|
建议: 使用标准伪元素 ::placeholder,并最好为旧浏览器保留前缀版本(如同时提供 ::-webkit-input-placeholder 和 ::placeholder)。
|
|
- 🔴 `stylelint:block-no-empty` L312
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:selector-anb-no-unmatchable` L312
|
|
无法匹配任何元素的 An+B 选择器“:nth-child(0n)”。
|
|
建议: 删除该规则,或改用能匹配元素的表达式,如 nth-child(n)。
|
|
- 🔴 `stylelint:block-no-empty` L316
|
|
空规则块。
|
|
建议: 删除空块,或在其中添加实际样式声明。
|
|
- 🔴 `stylelint:string-no-newline` L321
|
|
字符串包含换行。
|
|
建议: 属性选择器中的字符串不能跨行,应使用转义(如 \a)或调整属性值。
|
|
- 🔴 `stylelint:color-named` L323
|
|
不允许使用命名颜色“red”。
|
|
建议: 改用十六进制或颜色函数,如 #f00。
|
|
- 🔴 `stylelint:syntax-string-no-invalid` L328
|
|
非法的语法字符串“<invalid>”。
|
|
建议: @property 的 syntax 必须使用合法的 CSS 语法关键字,如 <length>、<color>、<number>。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L333
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:value-no-vendor-prefix` L335
|
|
带厂商前缀的值“-webkit-flex”。
|
|
建议: 使用标准值 flex。
|
|
- 🔴 `stylelint:no-duplicate-selectors` L340
|
|
重复的选择器“a”,首次使用在第 8 行。
|
|
建议: 合并相同选择器的规则,避免重复。
|
|
- 🔴 `stylelint:declaration-property-value-no-unknown` L341
|
|
属性 margin 的值“0 ”未知(包含不间断空格)。
|
|
建议: 删除 margin 值中的不可见空格,改为 margin: 0;。
|
|
- 🔴 `stylelint:no-irregular-whitespace` L341
|
|
发现不规则空白字符(通常为不换行空格)。
|
|
建议: 删除 0 后面的不换行空格,保留普通空格。
|
|
|
|
AI 审查 · 6 条建议
|
|
|
|
- 🔴 [AI] [bug] `font-face-required-descriptors` L17
|
|
**@font-face 缺少必需的 font-family 和 src 描述符**
|
|
文件中的两个 @font-face 规则都没有定义 font-family 和 src。根据 CSS Fonts 规范,@font-face 必须包含这两个描述符,否则整个规则无效,浏览器不会加载任何自定义字体。当前示例中还包含未知描述符/非法值,更加重了问题。
|
|
建议: 为每个 @font-face 补齐 font-family(自定义字体名称)和 src(字体资源路径与格式),例如:@font-face { font-family: "MyFont"; src: url("/fonts/myfont.woff2") format("woff2"); font-display: swap; }
|
|
- 🟡 [AI] [performance] `uncompressed-merged-output` L2
|
|
**声称是合并压缩文件,但实际未压缩,存在大量冗余**
|
|
文件注释说明“由 22 个 CSS 文件合并压缩而来”,但内容保留了所有源文件注释、空行、重复选择器和重复声明。这种“压缩”并未减小体积,仍会产生大量冗余下载流量,且重复规则会增加层叠冲突和样式表解析时间。
|
|
建议: 使用 CSS 压缩工具(如 cssnano、clean-css、csso)对合并产物进行压缩,并在构建流程中剥离开发注释、合并重复选择器。
|
|
- 🟡 [AI] [performance] `import-performance` L6
|
|
**@import 引入额外样式会阻塞渲染,应避免**
|
|
文件中存在多个 @import 规则(包括第 6、13、131、132 行),即使将位置移到顶部,@import 也会使浏览器必须串行下载依赖样式,延迟页面渲染。更严重的是一部分 @import 位于非法位置,会被浏览器忽略,导致依赖样式缺失。
|
|
建议: 改用 <link rel="stylesheet"> 在 HTML 中引用样式,或在构建阶段将 @import 的文件直接合并进当前文件。
|
|
- 🟡 [AI] [bug] `dead-color-declarations` L89
|
|
**同一规则块内多条 color 声明相互覆盖,形成死代码**
|
|
从第 75 行开始的 a 规则块中依次声明了 #12345、#ffffff、rgb(255, 0, 0)、rgba(0, 0, 0, 50%) 和 hsl(120, 50%, 50%),但同一属性在同一个块中只有最后一个会生效,前面的颜色值全部被覆盖,属于无效代码。这也导致该块变得难以理解。
|
|
建议: 删除被覆盖的 color 声明,只保留最终需要生效的 hsl(120deg 50% 50%)(并根据 color-function-notation 的规则写为现代空格式)。
|
|
- 🟡 [AI] [design] `missing-standard-prefix-fallback` L267
|
|
**仅使用带厂商前缀的语法,缺少标准无前缀写法**
|
|
代码中只出现了 -webkit-transform、-webkit-keyframes、-webkit-min-device-pixel-ratio、-webkit-flex、::-webkit-input-placeholder 等带前缀的写法,但没有对应的标准写法。现代浏览器可能不再支持旧前缀语法,导致这些样式在主流环境中失效;同时也忽略了其他需要前缀的浏览器。
|
|
建议: 同时提供标准属性和前缀属性(通常标准写法靠后),例如 transform 和 -webkit-transform 都写,或者直接使用标准属性并配合 Autoprefixer 等工具自动添加前缀。
|
|
- 🔵 [AI] [design] `missing-charset-declaration` L1
|
|
**文件包含非 ASCII 字符但未声明 @charset**
|
|
该 CSS 文件中包含大量中文注释,但在文件开头没有 @charset "UTF-8"; 声明。如果通过 file:// 协议打开或 HTTP 头未指定编码,中文注释可能被错误解码,导致注释边界解析错误。
|
|
建议: 在文件第一行添加 @charset "UTF-8";,并确保文件保存为 UTF-8 编码。
|