vize_carton 0.100.0

Carton - The artist's toolbox for Vize compiler
Documentation
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
{
  "test.hello": "你好",
  "test.greeting": "你好,{name}!",
  "diagnostic.format": "[vize:{rule}] {message}",
  "diagnostic.format.ts": "[vize:TS{code}] {message}",
  "category.essential": "必需",
  "category.strongly_recommended": "强烈推荐",
  "category.recommended": "推荐",
  "category.vapor": "Vapor",
  "category.musea": "Musea",
  "category.script": "脚本",
  "category.css": "CSS",
  "category.a11y": "无障碍",
  "category.security": "安全",
  "category.performance": "性能",
  "vue/require-v-for-key.description": "要求v-for指令使用v-bind:key",
  "vue/require-v-for-key.message": "迭代元素需要'v-bind:key'指令。元素: <{tag}>",
  "vue/require-v-for-key.help": "**原因:** `:key`属性帮助Vue的虚拟DOM高效地跟踪和更新列表项。\n\n**修复:** 添加唯一标识符作为key:\n```vue\n<li v-for=\"item in items\" :key=\"item.id\">\n  {{ item.name }}\n</li>\n```\n\n**最佳实践:**\n- 使用唯一、稳定的标识符(如数据库ID)\n- 当列表顺序可能改变时,避免使用数组索引作为key\n- key必须是原始值(字符串或数字)",
  "vue/valid-v-for.description": "强制有效的v-for指令",
  "vue/valid-v-for.missing_expression": "v-for指令需要一个表达式",
  "vue/valid-v-for.invalid_syntax": "v-for语法无效: 需要'item in items'或'(item, index) in items'格式",
  "vue/valid-v-for.help": "**有效的v-for语法:**\n```vue\n<!-- 数组迭代 -->\n<li v-for=\"item in items\">{{ item }}</li>\n<li v-for=\"(item, index) in items\">{{ index }}: {{ item }}</li>\n\n<!-- 对象迭代 -->\n<li v-for=\"(value, key) in object\">{{ key }}: {{ value }}</li>\n<li v-for=\"(value, key, index) in object\">{{ index }}</li>\n\n<!-- 范围 -->\n<span v-for=\"n in 10\">{{ n }}</span>\n```",
  "vue/valid-v-if.description": "强制有效的v-if指令",
  "vue/valid-v-if.missing_expression": "v-if指令需要一个表达式",
  "vue/valid-v-if.help": "**修复:** 添加布尔表达式:\n```vue\n<div v-if=\"isVisible\">内容</div>\n<div v-if=\"items.length > 0\">有项目</div>\n```\n\n**注意:** 频繁切换使用`v-show`(性能更好),很少改变的条件使用`v-if`。",
  "vue/valid-v-else.description": "强制有效的v-else指令",
  "vue/valid-v-else.unexpected_expression": "v-else指令不需要表达式",
  "vue/valid-v-else.missing_v_if": "v-else需要对应的v-if或v-else-if",
  "vue/valid-v-else.help": "**正确用法:**\n```vue\n<div v-if=\"type === 'A'\">A</div>\n<div v-else-if=\"type === 'B'\">B</div>\n<div v-else>其他</div>\n```\n\n**规则:**\n- `v-else`不需要表达式\n- 必须紧跟在`v-if`或`v-else-if`之后\n- 它们之间不能有其他元素",
  "vue/valid-v-bind.description": "强制有效的v-bind指令",
  "vue/valid-v-bind.missing_expression": "v-bind需要一个表达式",
  "vue/valid-v-bind.help": "**修复:** 提供要绑定的值:\n```vue\n<!-- 简写 -->\n<img :src=\"imageUrl\" :alt=\"imageAlt\">\n\n<!-- 完整语法 -->\n<img v-bind:src=\"imageUrl\">\n\n<!-- 绑定多个属性 -->\n<div v-bind=\"{ id: itemId, class: itemClass }\"></div>\n```",
  "vue/valid-v-on.description": "强制有效的v-on指令",
  "vue/valid-v-on.missing_event": "v-on需要一个事件名",
  "vue/valid-v-on.help": "**修复:** 指定事件名:\n```vue\n<!-- 简写 -->\n<button @click=\"handleClick\">点击</button>\n\n<!-- 完整语法 -->\n<button v-on:click=\"handleClick\">点击</button>\n\n<!-- 带修饰符 -->\n<form @submit.prevent=\"onSubmit\">...</form>\n<input @keyup.enter=\"onEnter\">\n```",
  "vue/valid-v-model.description": "强制有效的v-model指令",
  "vue/valid-v-model.missing_expression": "v-model需要一个表达式",
  "vue/valid-v-model.invalid_element": "v-model不能用于<{tag}>元素",
  "vue/valid-v-model.help": "**支持的元素:**\n- `<input>` (text, checkbox, radio等)\n- `<textarea>`\n- `<select>`\n- 带有`modelValue` prop的自定义组件\n\n**示例:**\n```vue\n<input v-model=\"message\">\n<input v-model.number=\"age\" type=\"number\">\n<input v-model.trim=\"name\">\n<MyComponent v-model=\"value\">\n```",
  "vue/valid-v-show.description": "强制有效的v-show指令",
  "vue/valid-v-show.missing_expression": "v-show指令需要一个表达式",
  "vue/valid-v-show.on_template": "v-show不能用于<template>元素",
  "vue/valid-v-show.help": "**修复:** 添加布尔表达式:\n```vue\n<div v-show=\"isVisible\">内容</div>\n```\n\n**v-show vs v-if:**\n- `v-show`: 总是渲染,通过CSS切换显示(频繁切换时更好)\n- `v-if`: 条件渲染,完全添加/移除DOM",
  "vue/valid-v-slot.description": "强制有效的v-slot指令",
  "vue/valid-v-slot.invalid_location": "v-slot只能用于组件或template元素",
  "vue/valid-v-slot.help": "**正确用法:**\n```vue\n<!-- 默认插槽 -->\n<MyComponent v-slot=\"{ item }\">\n  {{ item }}\n</MyComponent>\n\n<!-- 具名插槽 -->\n<MyComponent>\n  <template #header>标题</template>\n  <template #footer>页脚</template>\n</MyComponent>\n```",
  "vue/no-use-v-if-with-v-for.description": "禁止在同一元素上使用v-if和v-for",
  "vue/no-use-v-if-with-v-for.message_access": "避免在同一元素上使用v-if和v-for。v-if条件无法访问v-for作用域变量",
  "vue/no-use-v-if-with-v-for.message_perf": "避免在同一元素上使用v-if和v-for。先使用computed属性过滤列表",
  "vue/no-use-v-if-with-v-for.help": "**问题:** `v-for`优先级高于`v-if`,导致在过滤前迭代整个列表。\n\n**方案1:** 使用computed属性:\n```vue\n<script setup>\nconst activeUsers = computed(() => \n  users.filter(u => u.isActive)\n)\n</script>\n<template>\n  <li v-for=\"user in activeUsers\" :key=\"user.id\">\n</template>\n```\n\n**方案2:** 用`<template>`包装:\n```vue\n<template v-for=\"user in users\" :key=\"user.id\">\n  <li v-if=\"user.isActive\">{{ user.name }}</li>\n</template>\n```",
  "vue/no-unused-vars.description": "禁止v-for指令中未使用的变量定义",
  "vue/no-unused-vars.message": "变量'{name}'已定义但从未使用",
  "vue/no-unused-vars.help": "**选项:**\n\n1. 在模板中使用该变量\n2. 删除未使用的变量:\n```vue\n<!-- 之前 -->\n<li v-for=\"(item, index) in items\" :key=\"item.id\">\n\n<!-- 之后(如果index未使用) -->\n<li v-for=\"item in items\" :key=\"item.id\">\n```\n\n3. 添加`_`前缀表示故意不使用:\n```vue\n<li v-for=\"(_item, index) in items\" :key=\"index\">\n```",
  "vue/no-duplicate-attributes.description": "禁止重复属性",
  "vue/no-duplicate-attributes.message": "重复的属性'{attr}'",
  "vue/no-duplicate-attributes.help": "**问题:** 重复属性可能导致意外行为。\n\n**修复:** 删除重复的属性,只保留一个:\n```vue\n<!-- 错误 -->\n<input class=\"a\" class=\"b\">\n\n<!-- 正确 -->\n<input class=\"a b\">\n```",
  "vue/no-template-key.description": "禁止在template元素上使用key属性",
  "vue/no-template-key.message": "<template>元素不能有key属性",
  "vue/no-template-key.help": "**修复:** 将key移到template内的子元素上:\n```vue\n<!-- 错误 -->\n<template v-for=\"item in items\" :key=\"item.id\">\n  <div>{{ item }}</div>\n</template>\n\n<!-- 正确 -->\n<template v-for=\"item in items\">\n  <div :key=\"item.id\">{{ item }}</div>\n</template>\n```",
  "vue/no-textarea-mustache.description": "禁止在textarea中使用mustache插值",
  "vue/no-textarea-mustache.message": "不允许在textarea内使用mustache插值",
  "vue/no-textarea-mustache.help": "**问题:** `<textarea>{{ value }}</textarea>`无法正常工作。\n\n**修复:** 使用v-model:\n```vue\n<!-- 错误 -->\n<textarea>{{ message }}</textarea>\n\n<!-- 正确 -->\n<textarea v-model=\"message\"></textarea>\n```",
  "vue/no-dupe-v-else-if.description": "禁止v-if链中的重复条件",
  "vue/no-dupe-v-else-if.message": "此条件与同一v-if/v-else-if链中的条件重复",
  "vue/no-dupe-v-else-if.help": "**问题:** 重复条件永远不会执行。\n\n**修复:**\n```vue\n<!-- 错误 -->\n<div v-if=\"a\">A</div>\n<div v-else-if=\"a\">重复!</div>\n\n<!-- 正确 -->\n<div v-if=\"a\">A</div>\n<div v-else-if=\"b\">B</div>\n```",
  "vue/no-reserved-component-names.description": "禁止使用保留的组件名",
  "vue/no-reserved-component-names.message": "'{name}'是保留的HTML元素名,不能用作组件名",
  "vue/no-reserved-component-names.help": "**问题:** 使用保留名可能与HTML元素冲突。\n\n**修复:** 重命名组件:\n```vue\n<!-- 错误 -->\n<script setup>\n// 组件名为 \"Button\"\n</script>\n\n<!-- 正确 -->\n<script setup>\n// 组件名为 \"AppButton\" 或 \"CustomButton\"\n</script>\n```",
  "vue/no-template-shadow.description": "禁止v-for中的变量遮蔽",
  "vue/no-template-shadow.message": "变量'{name}'遮蔽了外部作用域的变量",
  "vue/no-template-shadow.help": "**问题:** 内层变量会遮蔽外层同名变量,导致混淆。\n\n**修复:** 重命名变量:\n```vue\n<!-- 错误 -->\n<div v-for=\"item in items\">\n  <span v-for=\"item in item.children\"><!-- 遮蔽 --></span>\n</div>\n\n<!-- 正确 -->\n<div v-for=\"item in items\">\n  <span v-for=\"child in item.children\"></span>\n</div>\n```",
  "vue/no-inline-style.description": "不建议使用内联style属性",
  "vue/no-inline-style.message": "避免使用内联style属性",
  "vue/no-inline-style.help": "**原因:** 内联样式难以维护和覆盖。\n\n**修复:** 使用CSS类或scoped样式:\n```vue\n<!-- 不推荐 -->\n<div style=\"color: red;\">文本</div>\n\n<!-- 推荐 -->\n<div class=\"error-text\">文本</div>\n\n<style scoped>\n.error-text { color: red; }\n</style>\n```",
  "vue/no-multi-spaces.description": "禁止多个连续空格",
  "vue/no-multi-spaces.message": "发现多个连续空格",
  "vue/no-multi-spaces.help": "**修复:** 将多个空格替换为单个空格:\n```vue\n<!-- 错误 -->\n<div class=\"foo    bar\">内容</div>\n\n<!-- 正确 -->\n<div class=\"foo bar\">内容</div>\n```",
  "vue/v-bind-style.description": "强制v-bind指令风格",
  "vue/v-bind-style.prefer_shorthand": "使用简写':'代替'v-bind:'",
  "vue/v-bind-style.prefer_longform": "使用'v-bind:'代替简写':'",
  "vue/v-bind-style.help": "**简写(推荐):**\n```vue\n<img :src=\"url\">\n```\n\n**完整形式:**\n```vue\n<img v-bind:src=\"url\">\n```",
  "vue/v-on-style.description": "强制v-on指令风格",
  "vue/v-on-style.prefer_shorthand": "使用简写'@'代替'v-on:'",
  "vue/v-on-style.prefer_longform": "使用'v-on:'代替简写'@'",
  "vue/v-on-style.help": "**简写(推荐):**\n```vue\n<button @click=\"onClick\">点击</button>\n```\n\n**完整形式:**\n```vue\n<button v-on:click=\"onClick\">点击</button>\n```",
  "vue/multi-word-component-names.description": "要求组件名为多个单词",
  "vue/multi-word-component-names.message": "组件名\"{name}\"应该是多个单词以避免与HTML元素冲突",
  "vue/multi-word-component-names.help": "**原因:** 单词组件名可能与现有或未来的HTML元素冲突。\n\n**修复:**\n```vue\n<!-- 错误 -->\n<script setup>\n// Item.vue\n</script>\n\n<!-- 正确 -->\n<script setup>\n// TodoItem.vue, ListItem.vue\n</script>\n```",
  "vue/a11y-img-alt.description": "要求图片有alt属性以确保无障碍",
  "vue/a11y-img-alt.message": "<img>元素需要alt属性以确保无障碍",
  "vue/a11y-img-alt.help": "为信息性图片添加alt=\"描述\",为装饰性图片添加alt=\"\"",
  "vue/no-unsafe-url.description": "警告潜在的不安全URL绑定",
  "vue/no-unsafe-url.message": "动态:{attr}绑定可能通过javascript:协议导致XSS漏洞",
  "vue/no-unsafe-url.static_message": "静态URL属性使用了潜在不安全协议或可执行data URL",
  "vue/no-unsafe-url.static_help": "请使用http(s)、相对URL或不可执行的data URL。避免javascript:、vbscript:、text/html data URL和SVG data URL",
  "vue/no-unsafe-url.help_href": "考虑使用<router-link :to=\"...\">或使用@braintree/sanitize-url净化URL",
  "vue/no-unsafe-url.help_src": "确保在绑定前净化URL。使用@braintree/sanitize-url进行验证",
  "vue/no-unsafe-url.help": "在绑定前净化URL以防止通过javascript:协议的XSS攻击",
  "vue/no-v-html.description": "禁止使用v-html以防止XSS攻击",
  "vue/no-v-html.message": "v-html可能导致XSS攻击。避免在用户提供的内容中使用",
  "vue/no-v-html.help": "**安全风险:** `v-html`渲染原始HTML,可能执行用户输入的恶意脚本。\n\n**替代方案:**\n\n1. 使用文本插值(自动转义):\n```vue\n<p>{{ userContent }}</p>\n```\n\n2. 使用净化库:\n```ts\nimport DOMPurify from 'dompurify'\nconst safeHtml = DOMPurify.sanitize(userInput)\n```\n\n3. 使用带XSS保护的markdown渲染器\n\n**如果必须使用v-html:**\n- 永远不要用于用户提供的内容\n- 只用于可信的静态内容",
  "vue/html-self-closing.description": "强制自闭合样式",
  "vue/html-self-closing.void": "void元素应该自闭合",
  "vue/html-self-closing.empty": "空元素应该自闭合",
  "vue/html-self-closing.component": "空组件应该自闭合",
  "vue/html-self-closing.help": "使用自闭合语法",
  "vue/prefer-props-shorthand.description": "强制同名prop绑定使用简写语法",
  "vue/prefer-props-shorthand.message": "对同名prop绑定使用简写语法",
  "vue/prefer-props-shorthand.help": "使用prop简写语法",
  "vue/attribute-hyphenation.description": "强制模板中属性名的命名风格",
  "vue/attribute-hyphenation.message": "属性应使用连字符命名",
  "vue/attribute-hyphenation.help": "属性名使用kebab-case风格",
  "vue/attribute-order.description": "强制模板中属性的排列顺序",
  "vue/attribute-order.message": "属性应按正确顺序排列",
  "vue/attribute-order.help": "按推荐顺序重新排列属性",
  "vue/no-lone-template.description": "禁止不必要的template使用",
  "vue/no-lone-template.message": "没有指令的`<template>`是不必要的",
  "vue/no-lone-template.help": "删除`<template>`包装器或添加指令(v-if、v-for、v-slot)",
  "vue/mustache-interpolation-spacing.description": "强制mustache插值的间距",
  "vue/mustache-interpolation-spacing.expected": "mustache插值内需要空格",
  "vue/mustache-interpolation-spacing.unexpected": "mustache插值内有多余的空格",
  "vue/mustache-interpolation-spacing.help_expected": "添加空格: {{ value }}",
  "vue/mustache-interpolation-spacing.help_unexpected": "删除空格: {{value}}",
  "vue/scoped-event-names.description": "建议使用有作用域的事件名以便更好地组织",
  "vue/scoped-event-names.message": "考虑使用有作用域的事件名以便更好地组织",
  "vue/scoped-event-names.help": "使用'update:modelValue'这样的有作用域的事件名代替通用名称",
  "vue/component-name-in-template-casing.description": "强制模板中组件名的命名风格",
  "vue/component-name-in-template-casing.pascal": "组件应使用PascalCase",
  "vue/component-name-in-template-casing.kebab": "组件应使用kebab-case",
  "vue/component-name-in-template-casing.help_pascal": "组件名使用PascalCase",
  "vue/component-name-in-template-casing.help_kebab": "组件名使用kebab-case",
  "vue/no-undefined-refs.description": "禁止未定义的模板引用",
  "vue/no-undefined-refs.message": "'{name}'未定义",
  "vue/no-undefined-refs.help": "确保变量已导入或在<script setup>中定义",
  "vue/require-scoped-style.description": "要求style块使用scoped属性",
  "vue/require-scoped-style.message": "style块应使用scoped属性以防止样式泄漏",
  "vue/require-scoped-style.help": "**修复:** 向style块添加scoped属性:\n```vue\n<style scoped>\n.my-class { color: red; }\n</style>\n```\n\n**好处:**\n- 防止样式泄漏到其他组件\n- 避免全局命名冲突\n- 更好的组件封装",
  "vapor/no-inline-template.description": "禁止已弃用的inline-template属性",
  "vapor/no-inline-template.message": "inline-template已弃用且在Vapor中不受支持",
  "vapor/no-inline-template.help": "**修复:** 使用插槽代替inline-template:\n```vue\n<!-- 错误(已弃用) -->\n<my-component inline-template>\n  <div>内容</div>\n</my-component>\n\n<!-- 正确 -->\n<my-component>\n  <template #default>\n    <div>内容</div>\n  </template>\n</my-component>\n```",
  "vapor/prefer-static-class.description": "优先使用静态class而非动态绑定",
  "vapor/prefer-static-class.message": "对于常量值,优先使用静态class属性而非动态:class绑定",
  "vapor/prefer-static-class.help": "**原因:** 静态类在Vapor中更高效。\n\n**修复:**\n```vue\n<!-- 不推荐 -->\n<div :class=\"'static-class'\">内容</div>\n\n<!-- 推荐 -->\n<div class=\"static-class\">内容</div>\n```",
  "vapor/no-vue-lifecycle-events.description": "禁止@vue:xxx元素级生命周期事件",
  "vapor/no-vue-lifecycle-events.message": "@vue:{event}生命周期事件在Vapor中不受支持",
  "vapor/no-vue-lifecycle-events.help": "**修复:** 使用组件生命周期钩子:\n```vue\n<!-- 错误 -->\n<div @vue:mounted=\"onMounted\">内容</div>\n\n<!-- 正确 -->\n<script setup>\nimport { onMounted } from 'vue'\n\nonMounted(() => {\n  // 组件挂载时的逻辑\n})\n</script>\n```",
  "script/no-options-api.description": "禁止Options API模式",
  "script/no-options-api.message": "Options API在Vapor中不受支持。请使用Composition API",
  "script/no-options-api.help": "**修复:** 重构为使用Composition API:\n```vue\n<!-- 错误(Options API) -->\n<script>\nexport default {\n  data() { return { count: 0 } },\n  methods: { increment() { this.count++ } }\n}\n</script>\n\n<!-- 正确(Composition API) -->\n<script setup>\nimport { ref } from 'vue'\n\nconst count = ref(0)\nfunction increment() { count.value++ }\n</script>\n```",
  "script/no-get-current-instance.description": "禁止getCurrentInstance()",
  "script/no-get-current-instance.message": "getCurrentInstance()在Vapor组件中返回null",
  "script/no-get-current-instance.help": "**修复:** 使用provide/inject或composables:\n```ts\n// 错误\nconst instance = getCurrentInstance()\n\n// 正确 - 使用provide/inject\nconst value = inject('key')\n\n// 正确 - 使用composable\nfunction useMyFeature() {\n  const state = ref(0)\n  return { state }\n}\n```",
  "script/no-async-in-computed.description": "禁止computed属性中的异步函数",
  "script/no-async-in-computed.message": "computed属性不能是异步的。它们必须同步返回值",
  "script/no-async-in-computed.help": "**问题:** computed必须同步返回值。\n\n**修复:** 使用ref和带cleanup的watch处理异步操作,取消过期请求后再写入结果:\n```ts\nconst data = ref(null)\nwatch(source, async (value, _oldValue, onCleanup) => {\n  const controller = new AbortController()\n  let active = true\n  onCleanup(() => {\n    active = false\n    controller.abort()\n  })\n  const next = await fetchData(value, { signal: controller.signal })\n  if (active) data.value = next\n})\n```",
  "script/no-deep-destructure-in-props.description": "禁止defineProps中的深层嵌套解构",
  "script/no-deep-destructure-in-props.message": "避免在defineProps中使用深层嵌套解构(最大深度: {depth})",
  "script/no-deep-destructure-in-props.help": "**问题:** 深层解构会失去响应性。\n\n**修复:**\n```ts\n// 错误\nconst { user: { name } } = defineProps<{ user: User }>()\n\n// 正确\nconst props = defineProps<{ user: User }>()\nconst name = computed(() => props.user.name)\n```",
  "musea/require-title.description": "要求art块有title属性",
  "musea/require-title.message": "Art组件需要title属性",
  "musea/require-title.help": "添加title属性来描述组件",
  "a11y/img-alt.description": "要求图片有alt属性",
  "a11y/img-alt.message": "<img>元素需要alt属性以确保无障碍",
  "a11y/img-alt.help": "**原因:** 屏幕阅读器使用alt文本向视障用户描述图片。\n\n**信息性图片:**\n```vue\n<img src=\"chart.png\" alt=\"第四季度销售增长20%\">\n```\n\n**装饰性图片:**\n```vue\n<img src=\"decoration.png\" alt=\"\">\n```\n\n**复杂图片:**\n```vue\n<img src=\"diagram.png\" alt=\"流程图\" aria-describedby=\"desc\">\n<p id=\"desc\">详细描述...</p>\n```",
  "a11y/anchor-has-content.description": "要求锚点元素有无障碍内容",
  "a11y/anchor-has-content.message": "<a>元素必须有无障碍内容",
  "a11y/anchor-has-content.help": "**修复选项:**\n\n1. 添加文本内容:\n```vue\n<a href=\"/about\">关于我们</a>\n```\n\n2. 为仅图标链接添加aria-label:\n```vue\n<a href=\"/settings\" aria-label=\"设置\">\n  <IconSettings />\n</a>\n```\n\n3. 包含带alt的图片:\n```vue\n<a href=\"/\"><img src=\"logo.png\" alt=\"首页\"></a>\n```",
  "a11y/heading-has-content.description": "要求标题元素有无障碍内容",
  "a11y/heading-has-content.message": "<{tag}>元素必须有无障碍内容",
  "a11y/heading-has-content.help": "**原因:** 空标题会使屏幕阅读器用户困惑,破坏文档结构。\n\n**修复:**\n```vue\n<!-- 添加文本内容 -->\n<h2>章节标题</h2>\n\n<!-- 或为动态内容使用aria-label -->\n<h2 aria-label=\"加载中...\"><Spinner /></h2>\n```",
  "a11y/iframe-has-title.description": "要求iframe元素有title属性",
  "a11y/iframe-has-title.message": "<iframe>元素必须有title属性",
  "a11y/iframe-has-title.help": "**原因:** 屏幕阅读器会朗读title帮助用户理解iframe内容。\n\n**修复:**\n```vue\n<iframe \n  src=\"https://example.com/video\"\n  title=\"产品演示视频\"\n></iframe>\n```\n\n**注意:** title应描述内容,而非来源。",
  "a11y/no-distracting-elements.description": "禁止分散注意力的元素如<marquee>和<blink>",
  "a11y/no-distracting-elements.message": "<{tag}>元素会分散注意力,不应使用",
  "a11y/no-distracting-elements.help": "**问题:** 这些元素对认知障碍用户造成困扰。\n\n**修复:** 删除此元素或使用CSS动画(支持prefers-reduced-motion):\n```css\n@media (prefers-reduced-motion: no-preference) {\n  .animated { animation: slide 3s ease; }\n}\n```",
  "a11y/tabindex-no-positive.description": "禁止正数tabindex值",
  "a11y/tabindex-no-positive.message": "避免使用正数tabindex值",
  "a11y/tabindex-no-positive.help": "**问题:** 正数tabindex会打乱自然的Tab顺序。\n\n**修复:**\n```vue\n<!-- 可聚焦元素 -->\n<div tabindex=\"0\">可聚焦</div>\n\n<!-- 仅程序化聚焦 -->\n<div tabindex=\"-1\">程序化聚焦</div>\n\n<!-- 避免 -->\n<div tabindex=\"5\">不要使用正数</div>\n```",
  "a11y/click-events-have-key-events.description": "要求点击事件配合键盘事件处理程序",
  "a11y/click-events-have-key-events.message": "带@click的非交互元素必须同时有键盘事件处理程序",
  "a11y/click-events-have-key-events.help": "**原因:** 键盘用户无法触发仅有click的处理程序。\n\n**最佳方案:** 使用语义化元素:\n```vue\n<button @click=\"handleClick\">点击我</button>\n```\n\n**如果必须使用div:**\n```vue\n<div \n  role=\"button\"\n  tabindex=\"0\"\n  @click=\"handleClick\"\n  @keydown.enter=\"handleClick\"\n  @keydown.space=\"handleClick\"\n>\n  点击我\n</div>\n```",
  "a11y/form-control-has-label.description": "要求表单控件有关联的标签",
  "a11y/form-control-has-label.message": "<{tag}>元素必须有关联的标签",
  "a11y/form-control-has-label.help": "**方案1:** 使用`<label>`和`for`:\n```vue\n<label for=\"email\">邮箱</label>\n<input id=\"email\" type=\"email\">\n```\n\n**方案2:** 将input包在label中:\n```vue\n<label>\n  邮箱\n  <input type=\"email\">\n</label>\n```\n\n**方案3:** 使用aria-label:\n```vue\n<input type=\"search\" aria-label=\"搜索\">\n```\n\n**注意:** placeholder不能替代label。",
  "a11y/form-control-has-label.help_placeholder": "**警告:** 占位符文本在输入时消失,且并非所有用户都能访问。\n\n**修复:** 添加正确的label:\n```vue\n<label for=\"search\">搜索</label>\n<input id=\"search\" placeholder=\"输入关键词...\">\n```\n\n或使用aria-label:\n```vue\n<input aria-label=\"搜索\" placeholder=\"输入关键词...\">\n```",
  "a11y/aria-props.description": "禁止无效的ARIA属性",
  "a11y/aria-props.message": "无效的ARIA属性 '{attr}'",
  "a11y/aria-props.help": "**原因:** 无效的ARIA属性会阻止辅助技术向用户传达预期含义。\n\n**有效的ARIA属性**在WAI-ARIA规范中定义:\nhttps://www.w3.org/TR/wai-aria/#state_prop_def\n\n**常用ARIA属性:**\n```vue\n<!-- 标签 -->\n<input aria-label=\"搜索\" />\n<div aria-labelledby=\"title-id\">\n\n<!-- 状态 -->\n<button aria-expanded=\"false\">\n<input aria-invalid=\"true\">\n\n<!-- 关系 -->\n<input aria-describedby=\"hint-id\">\n<div aria-controls=\"panel-id\">\n```\n\n**注意:** 不允许自定义`aria-*`属性。只能使用WAI-ARIA规范中的属性。",
  "a11y/aria-props.help_suggestion": "**无效属性:** `{invalid}`\n\n**您是否想输入:** `{valid}`?\n\n这是一个常见的拼写错误。ARIA属性遵循WAI-ARIA规范的特定命名约定。",
  "a11y/aria-role.description": "带有ARIA role的元素必须使用有效的、非抽象的ARIA role",
  "a11y/aria-role.message": "'{role}' 不是有效的ARIA role",
  "a11y/aria-role.message_abstract": "'{role}' 是抽象的ARIA role,不能直接使用",
  "a11y/aria-role.help": "**原因:** 无效的ARIA role会阻止辅助技术向用户传达预期含义。\n\n**有效的ARIA role**在WAI-ARIA规范中定义:\nhttps://www.w3.org/TR/wai-aria/#role_definitions\n\n**常用role:**\n```vue\n<!-- 部件role -->\n<div role=\"button\">点击</div>\n<div role=\"dialog\">模态内容</div>\n<div role=\"checkbox\">切换</div>\n\n<!-- 地标role -->\n<nav role=\"navigation\">...</nav>\n<main role=\"main\">...</main>\n<aside role=\"complementary\">...</aside>\n\n<!-- 文档结构role -->\n<div role=\"heading\" aria-level=\"2\">标题</div>\n<div role=\"list\">...</div>\n```",
  "a11y/aria-role.help_abstract": "**抽象role**是ARIA规范中的基本概念,不能直接使用。\n\n**抽象role包括:**\n`command`, `composite`, `input`, `landmark`, `range`, `roletype`, `section`, `sectionhead`, `select`, `structure`, `widget`, `window`\n\n**请使用具体role:**\n```vue\n<!-- 代替 role=\"range\" -->\n<div role=\"slider\">...</div>\n<div role=\"progressbar\">...</div>\n\n<!-- 代替 role=\"input\" -->\n<div role=\"textbox\">...</div>\n<div role=\"checkbox\">...</div>\n```",
  "a11y/aria-role.help_suggestion": "**无效role:** `{invalid}`\n\n**您是否想输入:** `{valid}`?\n\n请参阅WAI-ARIA规范获取有效role的完整列表。",
  "a11y/no-aria-hidden-on-focusable.description": "禁止在可聚焦元素上使用aria-hidden=\"true\"",
  "a11y/no-aria-hidden-on-focusable.message": "不能在可聚焦元素上使用aria-hidden=\"true\"",
  "a11y/no-aria-hidden-on-focusable.help": "删除aria-hidden=\"true\"或使用tabindex=\"-1\"使元素不可聚焦",
  "a11y/no-access-key.description": "禁止使用accesskey属性",
  "a11y/no-access-key.message": "不应使用accesskey属性。访问键会导致键盘快捷键冲突",
  "a11y/no-access-key.help": "删除accesskey属性。访问键在不同平台上创建不一致的键盘快捷键,并与辅助技术快捷键冲突",
  "a11y/no-autofocus.description": "禁止使用autofocus属性",
  "a11y/no-autofocus.message": "不应使用autofocus属性。它可能会干扰屏幕阅读器用户的导航",
  "a11y/no-autofocus.help": "删除autofocus属性。需要时使用ref和focus()以编程方式管理焦点",
  "a11y/no-role-presentation-on-focusable.description": "禁止在可聚焦元素上使用role=\"presentation\"或role=\"none\"",
  "a11y/no-role-presentation-on-focusable.message": "可聚焦元素不能使用role=\"presentation\"或role=\"none\"",
  "a11y/no-role-presentation-on-focusable.help": "删除role属性或使元素不可聚焦。presentation角色在元素仍可聚焦的情况下删除了语义含义",
  "a11y/aria-unsupported-elements.description": "禁止在不支持的元素上使用ARIA属性",
  "a11y/aria-unsupported-elements.message": "<{tag}>不支持'{attr}'属性",
  "a11y/aria-unsupported-elements.help": "删除ARIA属性或role。<meta>、<html>、<script>和<style>等元素不会渲染,不支持ARIA",
  "a11y/no-redundant-roles.description": "禁止冗余的ARIA角色",
  "a11y/no-redundant-roles.message": "<{tag}>具有隐式角色'{role}'。role属性是冗余的",
  "a11y/no-redundant-roles.help": "删除冗余的role属性。该元素通过HTML语义已经隐式具有此角色",
  "a11y/mouse-events-have-key-events.description": "要求鼠标事件配对焦点/失焦事件",
  "a11y/mouse-events-have-key-events.message_enter": "@mouseenter/@mouseover必须配对@focus以确保键盘可访问性",
  "a11y/mouse-events-have-key-events.message_leave": "@mouseleave/@mouseout必须配对@blur以确保键盘可访问性",
  "a11y/mouse-events-have-key-events.help": "**原因:** 键盘和触屏用户无法触发鼠标事件。\n\n**修复:**\n```vue\n<div\n  @mouseenter=\"show\"\n  @mouseleave=\"hide\"\n  @focus=\"show\"\n  @blur=\"hide\"\n  tabindex=\"0\"\n>\n  悬停或聚焦\n</div>\n```",
  "a11y/alt-text.description": "要求媒体元素提供替代文本",
  "a11y/alt-text.message_img": "<img>元素必须有alt属性",
  "a11y/alt-text.message_area": "<area>元素必须有alt、aria-label或aria-labelledby",
  "a11y/alt-text.message_input_image": "<input type=\"image\">必须有alt、aria-label或aria-labelledby",
  "a11y/alt-text.message_object": "<object>元素必须有title、aria-label或aria-labelledby",
  "a11y/alt-text.help_img": "添加alt属性: `<img alt=\"描述\">` 或装饰性图片使用 `<img alt=\"\">`",
  "a11y/alt-text.help_area": "为<area>元素添加alt、aria-label或aria-labelledby",
  "a11y/alt-text.help_input_image": "为<input type=\"image\">添加alt、aria-label或aria-labelledby",
  "a11y/alt-text.help_object": "为<object>元素添加title、aria-label或aria-labelledby",
  "a11y/anchor-is-valid.description": "强制锚元素使用有效的href",
  "a11y/anchor-is-valid.message_empty": "<a>元素的href属性为空",
  "a11y/anchor-is-valid.message_hash": "<a>元素的href=\"#\"不是有效的导航目标",
  "a11y/anchor-is-valid.message_javascript": "<a>元素使用javascript: href不被推荐",
  "a11y/anchor-is-valid.message_missing": "<a>元素缺少href属性",
  "a11y/anchor-is-valid.help": "**修复:**\n```vue\n<!-- 使用有效的URL -->\n<a href=\"/about\">关于</a>\n\n<!-- 点击处理器请使用<button> -->\n<button @click=\"handleClick\">操作</button>\n\n<!-- 动态URL -->\n<a :href=\"url\">链接</a>\n```",
  "a11y/label-has-for.description": "要求标签关联表单控件",
  "a11y/label-has-for.message": "<label>必须有for属性或包裹表单控件(input、select、textarea)",
  "a11y/label-has-for.help": "**修复方法:**\n\n1. 使用for属性:\n```vue\n<label for=\"name\">姓名</label>\n<input id=\"name\" type=\"text\">\n```\n\n2. 包裹表单控件:\n```vue\n<label>姓名 <input type=\"text\"></label>\n```",
  "a11y/interactive-supports-focus.description": "要求交互角色元素可聚焦",
  "a11y/interactive-supports-focus.message": "具有role=\"{role}\"的元素必须可聚焦(添加tabindex=\"0\")",
  "a11y/interactive-supports-focus.help": "**原因:** 交互角色意味着键盘用户可以操作该元素。\n\n**修复:**\n```vue\n<div role=\"button\" tabindex=\"0\" @click=\"handle\">\n  点击\n</div>\n```\n\n**更好的方式:** 使用原生交互元素:\n```vue\n<button @click=\"handle\">点击</button>\n```",
  "a11y/role-has-required-aria-props.description": "要求ARIA角色具有必需的属性",
  "a11y/role-has-required-aria-props.message": "具有role=\"{role}\"的元素必须有'{prop}'属性",
  "a11y/role-has-required-aria-props.help": "**角色`{role}`需要:** {props}\n\n**示例:**\n```vue\n<div role=\"{role}\" {props}=\"...\">\n  内容\n</div>\n```",
  "a11y/media-has-caption.description": "要求媒体元素提供字幕",
  "a11y/media-has-caption.message": "<{tag}>元素必须有<track kind=\"captions\">以确保无障碍访问",
  "a11y/media-has-caption.help": "**修复:**\n```vue\n<video src=\"movie.mp4\">\n  <track kind=\"captions\" src=\"captions.vtt\" />\n</video>\n```\n\n**替代方案:**\n- 装饰性媒体添加`muted`属性\n- 有描述的媒体添加`aria-label`",
  "a11y/no-static-element-interactions.description": "禁止在静态元素上使用事件处理器",
  "a11y/no-static-element-interactions.message": "<{tag}>是静态元素,不应有交互事件处理器",
  "a11y/no-static-element-interactions.help": "**原因:** 非交互元素(div、span等)不应在没有role的情况下拥有点击/键盘处理器。\n\n**修复方法:**\n\n1. 使用原生交互元素:\n```vue\n<button @click=\"handle\">点击</button>\n```\n\n2. 添加role和tabindex:\n```vue\n<div role=\"button\" tabindex=\"0\" @click=\"handle\">\n  点击\n</div>\n```",
  "vue/use-unique-element-ids.description": "强制使用useId()代替静态字面量生成唯一元素ID",
  "vue/use-unique-element-ids.message": "静态 id=\"{value}\" 在组件多次渲染时可能导致重复ID",
  "vue/use-unique-element-ids.message_reference": "静态ID引用 '{value}' 可能引用非唯一ID",
  "vue/use-unique-element-ids.help": "**原因:** 静态`id`属性在组件多次渲染时可能导致重复ID,造成无障碍问题和功能故障(如label-input关联)。\n\n**修复:** 使用Vue 3.5+的`useId()`:\n```vue\n<script setup>\nimport { useId } from 'vue'\n\nconst id = useId()\n</script>\n\n<template>\n  <label :for=\"id\">姓名:</label>\n  <input :id=\"id\" type=\"text\">\n</template>\n```\n\n**优点:**\n- 为每个组件实例生成唯一ID\n- 在服务器和客户端渲染间保持稳定(SSR安全)\n- 支持label、ARIA属性和表单关联",
  "vue/use-unique-element-ids.help_has_use_id": "**很好:** 您已经在使用`useId()`。现在在模板中使用生成的ID:\n```vue\n<label :for=\"id\">姓名:</label>\n<input :id=\"id\" type=\"text\">\n```\n\n将静态的`id`、`for`和ARIA ID引用替换为动态值。",
  "vue/no-child-content.description": "禁止在使用v-html或v-text时包含子内容",
  "vue/no-child-content.message": "带有v-{directive}的元素的子内容将被覆盖",
  "vue/no-child-content.help": "使用`v-html`或`v-text`时,子内容会被忽略。请删除子内容",
  "vue/valid-attribute-name.description": "要求有效的属性名",
  "vue/valid-attribute-name.message": "属性名 '{name}' 无效",
  "vue/valid-attribute-name.help": "属性名不能包含空格、引号、`>`、`/`、`=`或控制字符",
  "vue/no-v-text-v-html-on-component.description": "禁止在组件元素上使用v-text/v-html",
  "vue/no-v-text-v-html-on-component.message": "v-{directive}不能用于组件<{tag}>",
  "vue/no-v-text-v-html-on-component.help": "组件有自己的渲染逻辑。请通过props或插槽传递内容",
  "vue/require-component-is.description": "要求`<component>`元素具有`v-bind:is`",
  "vue/require-component-is.message": "<component>需要`:is`或`is`属性",
  "vue/require-component-is.help": "`<component>`是动态组件,需要`is`属性来确定要渲染的组件",
  "vue/no-useless-template-attributes.description": "禁止<template>元素上的无用属性",
  "vue/no-useless-template-attributes.message": "'{attr}'在<template>上无意义 — 将被忽略",
  "vue/no-useless-template-attributes.help": "`<template>`不会渲染到DOM。只有结构性指令(v-if、v-for、v-slot)和`:key`有效",
  "vue/valid-v-memo.description": "强制有效的v-memo指令",
  "vue/valid-v-memo.missing_expression": "v-memo需要依赖数组表达式",
  "vue/valid-v-memo.unexpected_argument": "v-memo不接受参数",
  "vue/valid-v-memo.unexpected_modifier": "v-memo不接受修饰符",
  "vue/valid-v-memo.help": "请使用v-memo=\"[valueA, valueB]\"的形式指定依赖数组",
  "vue/use-v-on-exact.description": "使用系统修饰符时强制在v-on上使用.exact修饰符",
  "vue/use-v-on-exact.message": "没有.exact的@{event}在系统修饰键按下时也会触发",
  "vue/use-v-on-exact.help": "`@click`在按下Ctrl/Shift/Alt/Meta时也会触发。添加`.exact`使其仅在没有系统修饰键时触发",
  "vue/v-slot-style.description": "强制v-slot指令风格",
  "vue/v-slot-style.message_shorthand": "使用简写`#name`代替`v-slot:name`",
  "vue/v-slot-style.message_longform": "使用`v-slot:name`代替`#name`",
  "vue/v-slot-style.help": "**简写:** `<template #header>` (默认)\n**完整形式:** `<template v-slot:header>`\n\n选择一种风格并保持一致。",
  "vue/prop-name-casing.description": "强制模板中prop名使用kebab-case",
  "vue/prop-name-casing.message": "prop '{name}'应使用'{kebab}'(kebab-case)",
  "vue/prop-name-casing.help": "在模板中使用kebab-case的prop名:\n```vue\n<!-- 错误 -->\n<MyComponent myProp=\"value\" />\n\n<!-- 正确 -->\n<MyComponent my-prop=\"value\" />\n```",
  "vue/html-quotes.description": "强制HTML属性引号风格",
  "vue/html-quotes.message_double": "应使用双引号而非单引号",
  "vue/html-quotes.message_single": "应使用单引号而非双引号",
  "vue/html-quotes.help": "HTML属性值使用一致的引号风格。",
  "vue/component-definition-name-casing.description": "强制组件文件名使用PascalCase",
  "vue/component-definition-name-casing.message": "组件文件名'{name}'应使用PascalCase",
  "vue/component-definition-name-casing.help": "将文件名改为PascalCase:\n```\nmy-component.vue -> MyComponent.vue\nmyComponent.vue  -> MyComponent.vue\n```",
  "compiler.parse_error": "解析错误: {message}",
  "compiler.unexpected_token": "意外的标记'{token}'",
  "compiler.unclosed_tag": "未关闭的标签<{tag}>",
  "compiler.invalid_directive": "无效的指令语法: {directive}",
  "compiler.missing_end_tag": "<{tag}>缺少结束标签",
  "cli.compiling": "正在编译{count}个文件...",
  "cli.compiled": "在{time}ms内编译了{count}个文件",
  "cli.error_count": "发现{count}个错误",
  "cli.warning_count": "发现{count}个警告",
  "cli.slow_file_warning": "{file}编译缓慢({time}ms)",
  "cli.suggest_split": "考虑将大组件拆分为小组件",
  "cli.suggest_template": "检测到大模板({size}字节)。考虑将部分提取为子组件",
  "ssr/no-browser-globals-in-ssr.description": "禁止在SSR上下文中使用浏览器专用全局变量",
  "ssr/no-browser-globals-in-ssr.message": "'{name}'是浏览器专用全局变量,在SSR中不可用",
  "ssr/no-browser-globals-in-ssr.help": "**问题:** 浏览器API(如window、document)在服务器端不存在。\n\n**修复:** 将浏览器专用代码移到客户端生命周期钩子中:\n```vue\n<script setup>\nimport { onMounted } from 'vue'\n\nonMounted(() => {\n  // 浏览器专用代码\n  window.addEventListener('resize', handleResize)\n})\n</script>\n```\n\n或使用`<ClientOnly>`组件:\n```vue\n<ClientOnly>\n  <BrowserOnlyComponent />\n</ClientOnly>\n```",
  "ssr/no-hydration-mismatch.description": "禁止导致hydration不匹配的非确定性值",
  "ssr/no-hydration-mismatch.message": "'{pattern}'可能导致服务器和客户端之间的hydration不匹配",
  "ssr/no-hydration-mismatch.message-attr": "属性绑定中的'{pattern}'可能导致hydration不匹配",
  "ssr/no-hydration-mismatch.help": "**问题:** 服务器和客户端渲染的值不同会导致hydration错误。\n\n**常见问题:**\n- `Date.now()`, `Math.random()`\n- 基于时间的格式化\n- 客户端特定的值\n\n**修复:**\n```ts\n// 对于唯一ID\nconst id = useId()\n\n// 对于仅客户端的值\n<ClientOnly>\n  <span>{{ Date.now() }}</span>\n</ClientOnly>\n```",
  "ts/2304.message": "找不到名称'{name}'",
  "ts/2304.help": "**`{name}`** 未定义。\n\n**可能原因:**\n- 变量未导入或声明\n- 名称拼写错误\n- 变量定义在不同作用域\n\n**解决方案:**\n```ts\n// 1. 从模块导入\nimport { {name} } from './module';\n\n// 2. 在script setup中声明\nconst {name} = ...;\n\n// 3. 检查名称拼写\n```",
  "ts/2322.message": "类型'{source}'不能分配给类型'{target}'",
  "ts/2322.help": "**检测到类型不匹配。**\n\n您正尝试将`{source}`类型的值分配给期望`{target}`的目标。\n\n**常见修复:**\n- 检查值是否匹配期望的类型\n- 如果确定,使用类型断言: `value as {target}`\n- 更新类型定义以接受实际类型\n\n**示例:**\n```ts\n// 如果目标是'number'但源是'string'\nconst value = parseInt(stringValue); // 将string转换为number\n```",
  "ts/2339.message": "类型'{type}'上不存在属性'{name}'",
  "ts/2339.help": "**在`{type}`上找不到属性`{name}`。**\n\n**可能原因:**\n- 属性名拼写错误\n- 该类型上不存在此属性\n- 需要先缩窄类型\n\n**解决方案:**\n```ts\n// 1. 检查属性是否存在\nif ('{name}' in obj) {\n  obj.{name};\n}\n\n// 2. 使用可选链\nobj?.{name};\n\n// 3. 在类型定义中添加属性\ninterface MyType {\n  {name}: SomeType;\n}\n```",
  "ts/2345.message": "类型'{source}'的参数不能分配给类型'{target}'的参数",
  "ts/2345.help": "**参数类型不匹配。**\n\n函数期望`{target}`但收到`{source}`。\n\n**解决方案:**\n- 将值转换为期望的类型\n- 检查是否传递了正确的参数\n- 如需要更新函数签名\n\n```ts\n// 示例:函数期望number\nfunc(Number(value)); // 转换为number\n```",
  "ts/2349.message": "此表达式不可调用",
  "ts/2349.help": "**无法调用非函数值。**\n\n您正尝试调用不是函数的东西。\n\n**常见原因:**\n- 值是`undefined`或`null`\n- 它是对象,不是函数\n- 属性返回值,而非方法\n\n**解决方案:**\n```ts\n// 调用前检查是否是函数\nif (typeof maybeFunc === 'function') {\n  maybeFunc();\n}\n\n// 或使用可选链\nmaybeFunc?.();\n```",
  "ts/2531.message": "对象可能为'null'",
  "ts/2531.help": "**检测到可能的null值。**\n\nTypeScript警告此值可能为`null`。\n\n**解决方案:**\n```ts\n// 1. 使用可选链\nobj?.property;\n\n// 2. 使用空值合并\nconst value = obj ?? defaultValue;\n\n// 3. 添加null检查\nif (obj !== null) {\n  obj.property;\n}\n\n// 4. 使用非空断言(仅在确定时)\nobj!.property; // 仅在100%确定时使用\n```",
  "ts/2532.message": "对象可能为'undefined'",
  "ts/2532.help": "**检测到可能的undefined值。**\n\nTypeScript警告此值可能为`undefined`。\n\n**解决方案:**\n```ts\n// 1. 使用可选链\nobj?.property;\n\n// 2. 提供默认值\nconst value = obj ?? defaultValue;\n\n// 3. 添加undefined检查\nif (obj !== undefined) {\n  obj.property;\n}\n\n// 4. 初始化值\nconst obj = ref<Type>(initialValue);\n```",
  "ts/2554.message": "期望{expected}个参数,但获得{actual}个",
  "ts/2554.help": "**参数数量错误。**\n\n函数期望**{expected}**个参数,但您提供了**{actual}**个。\n\n**解决方案:**\n- 添加缺少的参数\n- 删除多余的参数\n- 检查函数签名\n\n```ts\n// 检查函数定义\nfunction example(a: string, b?: number) { }\n// 必需: a (string)\n// 可选: b (number)\n```",
  "ts/2555.message": "期望{expected}个参数,但获得{actual}个",
  "ts/2555.help": "**提供了过多参数。**\n\n函数只接受**{expected}**个参数,但您传递了**{actual}**个。\n\n**解决方案:**\n删除多余的参数或更新函数以接受更多参数。",
  "ts/2307.message": "找不到模块'{module}'或其对应的类型声明",
  "ts/2307.help": "**找不到模块: `{module}`**\n\n**可能原因:**\n- 包未安装\n- 导入路径不正确\n- 缺少类型声明\n\n**解决方案:**\n```bash\n# 1. 安装包\nnpm install {module}\n\n# 2. 安装类型声明(如果单独)\nnpm install -D @types/{module}\n```\n\n**对于本地模块:**\n- 检查文件路径是否正确\n- 使用相对路径: `./` 或 `../`\n- 检查文件扩展名",
  "ts/2300.message": "重复的标识符'{name}'",
  "ts/2300.help": "**`{name}`的重复声明。**\n\n此标识符已在此作用域中声明。\n\n**解决方案:**\n- 重命名其中一个声明\n- 删除重复项\n- 检查是否意外导入了同一内容两次",
  "ts/2451.message": "无法重新声明块作用域变量'{name}'",
  "ts/2451.help": "**变量`{name}`已声明。**\n\n不能在同一作用域中重新声明`let`或`const`变量。\n\n**解决方案:**\n```ts\n// 1. 重命名变量\nconst {name}2 = ...;\n\n// 2. 赋值而非重新声明\n{name} = newValue; // 如果使用let\n\n// 3. 使用不同作用域\n{\n  const {name} = ...; // 在新块中可以\n}\n```",
  "ts/7006.message": "参数'{name}'隐式具有'any'类型",
  "ts/7006.help": "**`{name}`缺少类型注解。**\n\nTypeScript无法推断此参数的类型。\n\n**解决方案 - 添加显式类型:**\n```ts\n// 之前\nfunction example({name}) { }\n\n// 之后\nfunction example({name}: string) { }\n\n// 带默认值(类型推断)\nfunction example({name} = 'default') { }\n```",
  "ts/2741.message": "类型'{source}'中缺少属性'{name}',但类型'{target}'中需要该属性",
  "ts/2741.help": "**缺少必需属性: `{name}`**\n\n类型`{target}`需要属性`{name}`,但它在`{source}`中不存在。\n\n**解决方案:**\n```ts\n// 1. 添加缺少的属性\nconst obj: {target} = {\n  ...existingProps,\n  {name}: value,\n};\n\n// 2. 在类型定义中使属性可选\ninterface {target} {\n  {name}?: Type; // 可选\n}\n```",
  "ts/2344.message": "类型'{type}'不满足约束'{constraint}'",
  "ts/2344.help": "**类型约束违规。**\n\n类型`{type}`不满足`{constraint}`的要求。\n\n**解决方案:**\n确保您的类型扩展或实现所需的约束:\n```ts\n// 示例: T必须扩展SomeBase\nfunction example<T extends SomeBase>(value: T) { }\n```",
  "ts/2351.message": "此表达式不可构造",
  "ts/2351.help": "**无法对此值使用`new`。**\n\n此表达式不能与`new`一起使用。\n\n**常见原因:**\n- 它不是类或构造函数\n- 您试图实例化类型,而非类\n\n**示例:**\n```ts\n// 错误: 类型别名,不是类\ntype MyType = { x: number };\nnew MyType(); // 错误!\n\n// 正确: 使用类\nclass MyClass { x: number = 0; }\nnew MyClass(); // 可以\n```",
  "ts/vue/9001.message": "'{name}'的prop类型无效",
  "ts/vue/9001.help": "**`{name}`的Prop类型不匹配。**\n\nprop值与`defineProps`中定义的期望类型不匹配。\n\n**解决方案:**\n```ts\n// 检查prop定义\ndefineProps<{\n  {name}: string; // 期望类型\n}>();\n\n// 确保父组件传递正确类型\n<MyComponent :{name}=\"stringValue\" />\n```",
  "ts/vue/9002.message": "无效的emit调用: '{event}'",
  "ts/vue/9002.help": "**`{event}`的emit用法无效。**\n\nemit调用与定义的事件不匹配。\n\n**解决方案:**\n```ts\n// 检查emit定义\nconst emit = defineEmits<{\n  {event}: [payload: PayloadType];\n}>();\n\n// 用正确的payload调用\nemit('{event}', payload);\n```",
  "ts/vue/9003.message": "未知组件: '{name}'",
  "ts/vue/9003.help": "**找不到组件`{name}`。**\n\n**可能原因:**\n- 组件未导入\n- 组件名拼写错误\n- 使用了kebab-case而非PascalCase(或反之)\n\n**解决方案:**\n```ts\n// 导入组件\nimport {name} from './components/{name}.vue';\n\n// 或全局注册\napp.component('{name}', {name});\n```",
  "ts/vue/9004.message": "无效的slot用法: '{name}'",
  "ts/vue/9004.help": "**Slot `{name}` 用法错误。**\n\n**常见问题:**\n- 组件上不存在此slot\n- slot props错误\n\n**用法:**\n```vue\n<template>\n  <MyComponent>\n    <template #{name}=\"{ prop }\">\n      <!-- slot内容 -->\n    </template>\n  </MyComponent>\n</template>\n```",
  "ts/vue/9005.message": "无效的指令: '{name}'",
  "ts/vue/9005.help": "**指令`{name}`错误。**\n\n**常见原因:**\n- 指令未注册\n- 指令语法错误\n\n**解决方案:**\n```ts\n// 局部注册指令\nimport { v{name} } from './directives';\n\n// 或全局注册\napp.directive('{name}', {\n  mounted(el, binding) { ... }\n});\n```",
  "ts/vue/9006.message": "检测到响应性问题",
  "ts/vue/9006.help": "**可能丢失响应性。**\n\n您的代码可能因值的访问或解构方式而丢失响应性。\n\n**常见问题和修复:**\n```ts\n// 错误 - 解构丢失响应性\nconst { count } = props;\n\n// 正确 - 使用toRefs\nconst { count } = toRefs(props);\n\n// 错误 - 赋值ref的value\nlet x = ref(0).value;\n\n// 正确 - 保持ref\nconst x = ref(0);\n```",

  "a11y/no-i-for-icon.description": "禁止使用<i>元素作为图标",
  "a11y/no-i-for-icon.message": "带有图标CSS类的<i>元素不应用作图标,请使用语义化元素代替",
  "a11y/no-i-for-icon.help": "**原因:** `<i>`元素在HTML中语义为*斜体文本*。将其用于图标字体会导致无障碍问题——屏幕阅读器可能会朗读无意义的内容。\n\n**修复:** 使用`<span>`配合`aria-hidden=\"true\"`:\n```vue\n<span class=\"fas fa-home\" aria-hidden=\"true\"></span>\n<span class=\"sr-only\">首页</span>\n```\n\n或使用SVG图标组件以获得最佳无障碍体验。",

  "a11y/no-refer-to-non-existent-id.description": "禁止引用不存在的ID",
  "a11y/no-refer-to-non-existent-id.message": "{kind}属性引用的id=\"{id}\"在模板中不存在",
  "a11y/no-refer-to-non-existent-id.help": "**原因:** `for`、`aria-labelledby`、`aria-describedby`等ID引用属性必须指向一个存在的带有该`id`的元素。引用失效会静默破坏关联。\n\n**修复:** 确保引用的ID存在于模板中:\n```vue\n<label for=\"name\">姓名:</label>\n<input id=\"name\" type=\"text\">\n```",

  "vue/use-unique-element-ids.message_form": "表单元素使用了静态id=\"{value}\"——请使用useId()确保标签/输入关联正常工作",
  "vue/use-unique-element-ids.message_aria_ref": "带有ARIA引用的元素使用了静态id=\"{value}\"——请使用useId()确保ARIA关联的唯一性",

  "vue/permitted-contents.description": "强制执行HTML内容模型规则",
  "vue/permitted-contents.block_in_inline": "<{child}>(块级元素)不允许出现在<{parent}>(仅允许短语内容)内",
  "vue/permitted-contents.interactive_nesting": "<{tag}>是交互元素,不能嵌套在其他交互元素内",
  "vue/permitted-contents.invalid_child": "<{child}>不允许作为<{parent}>的直接子元素",
  "vue/permitted-contents.help": "**原因:** HTML有内容模型规则,定义了哪些元素可以嵌套在其他元素内。违反这些规则会导致浏览器自动修正DOM,产生意外的渲染结果。\n\n**主要规则:**\n- `<p>`、`<span>`、`<a>`只能包含短语(内联)内容\n- `<a>`和`<button>`不能相互嵌套\n- `<ul>/<ol>`的直接子元素只能是`<li>`\n- `<table>`的直接子元素只能是`<thead>`、`<tbody>`、`<tfoot>`、`<tr>`或`<caption>`",

  "category.html_conformance": "HTML合规",

  "html/deprecated-element.message": "<{tag}>是已弃用的HTML元素",
  "html/deprecated-element.help": "此元素已被HTML Living Standard废弃。请使用带有CSS的现代HTML元素代替。",

  "html/deprecated-attr.message": "<{tag}>上的\"{attr}\"属性已弃用",
  "html/deprecated-attr.help": "请使用{suggestion}代替。",

  "html/no-consecutive-br.message": "检测到连续的<br>元素",
  "html/no-consecutive-br.help": "使用<p>元素或CSS margin/padding来控制间距,而不是多个<br>标签。",

  "html/id-duplication.message": "模板中发现重复的id=\"{id}\"",
  "html/id-duplication.help": "元素ID在文档中必须唯一。重复的ID会破坏label关联、ARIA引用和getElementById()。",

  "html/require-datetime.message": "当内容不是有效的日期时间字符串时,<time>元素需要datetime属性",
  "html/require-datetime.help": "添加包含机器可读日期/时间值的datetime属性,例如:<time datetime=\"2024-12-25\">圣诞节</time>",

  "html/no-empty-palpable-content.message": "<{tag}>元素为空,但应包含可见内容",
  "html/no-empty-palpable-content.help": "添加文本内容、子元素,或使用aria-label提供无障碍内容。",

  "html/no-duplicate-dt.message": "<dl>中存在重复的<dt>术语\"{term}\"",
  "html/no-duplicate-dt.help": "定义列表中的每个术语应该是唯一的。将定义合并到单个<dt>下或使用不同的术语。",

  "a11y/heading-levels.message": "标题级别从<{from}>跳到了<{to}>",
  "a11y/heading-levels.help": "标题级别应逐级递增。屏幕阅读器用户通过标题级别进行导航,跳级会使文档结构变得混乱。",

  "a11y/use-list.message": "文本看起来是列表项。请使用<ul>或<ol>实现正确的列表语义",
  "a11y/use-list.help": "屏幕阅读器无法将项目符号字符识别为列表项。请使用语义化的<ul>/<ol>和<li>元素代替。",

  "a11y/placeholder-label-option.message": "占位符<option>应具有disabled或hidden属性",
  "a11y/placeholder-label-option.help": "为占位符<option>添加disabled或hidden以防止其被选中:\n<option value=\"\" disabled>请选择</option>",

  "a11y/landmark-roles.duplicate_main": "每个页面只允许一个<main>地标",
  "a11y/landmark-roles.help_duplicate_main": "页面应该只有一个<main>地标。删除重复的<main>元素或仅在一个元素上使用role=\"main\"。",
  "a11y/landmark-roles.missing_label": "发现多个\"{role}\"地标但缺少独特标签",
  "a11y/landmark-roles.help_missing_label": "当存在多个相同类型的地标时,每个都应有唯一的aria-label或aria-labelledby以帮助用户区分。",

  "vue/no-boolean-attr-value.message": "布尔属性\"{attr}\"不应有值\"{value}\"",
  "vue/no-boolean-attr-value.help": "请移除值。使用{attr}而不是{attr}=\"...\"。"
}