Svelte自定义Web组件：如何让svelte-check识别其无障碍支持？

当使用内部已封装原生<button>并处理好无障碍支持的自定义组件<custom-button>时，Svelte的静态检查工具svelte-check可能会误报点击事件的无障碍规则，你可以通过以下两种方式解决：

方式一：忽略单个组件实例的错误 #

在组件标签上方添加特定注释，告知svelte-check跳过当前实例的该规则检查：

<!-- svelte-ignore a11y-click-events-have-key-events -->
<custom-button on:click={handleClick}>点击按钮</custom-button>

方式二：全局配置忽略该组件的规则检查 #

如果项目中大量使用该自定义组件，可以在ESLint配置文件（如.eslintrc.cjs）中添加规则例外，全局忽略<custom-button>的该无障碍检查：

module.exports = {
  extends: [...], // 保留原有扩展配置
  rules: {
    'sveltejs/a11y-click-events-have-key-events': [
      'error',
      {
        ignore: ['custom-button']
      }
    ]
  }
};

这两种方法都能有效解决误报问题，因为你的<custom-button>内部已经通过原生<button>实现了完整的键盘交互（如Enter、Space键触发点击）和无障碍属性，无需额外添加键盘事件。

内容的提问来源于stack exchange，提问作者Sebastian