ESLint Disallow Use of Alert (no-alert)

Posted

技术标签:

【中文标题】ESLint Disallow Use of Alert (no-alert)【英文标题】: 【发布时间】:2016-05-20 09:35:21 【问题描述】:

如何将以下警报转换为 ESLint 可接受的警报?

svg.onerror = function() 
    alert("File cannot be loaded");
;

我的构建失败,因为显然我不能使用“警报”。当加载某些内容出现问题时,我想调用此警报。此代码成功运行,但不符合 ESLint。

http://eslint.org/docs/rules/no-alert

如何修改我的代码以使其成功构建?

提前致谢:)

【问题讨论】:

Turning off eslint rule for a specific line的可能重复 【参考方案1】:

如果你认为你有充分的理由不遵守 eslint 设置,那么你可以通过在有问题的行的注释中指定 eslint-disable-line 来禁用该特定行的特定规则,如下所示:

svg.onerror = function() 
    alert("File cannot be loaded");  // eslint-disable-line no-alert
;

更好的解决方案可能是实现模态或以另一种侵入性较小的方式向用户显示错误(例如:切换错误元素的可见性,或使用类似 Bootstrap 的模态)。

【讨论】:

有没有办法让警报符合 eslint 标准?他们在我上面给出的链接中举了一个例子,但我不明白。 是的!这些文档的相关部分是:“此规则旨在捕获应该删除的调试代码和弹出 UI 元素,应该用不太显眼的自定义 UI 替换。”在这种情况下,您可以在您正在使用的元素附近放置类似<div id="svg-error" class="warning" style="display: none;">Couldn't load SVG!</div> 的东西。然后,在 svg 的 onerror 事件中,您将执行类似 $('#svg-error').show() 的操作来显示错误而不是发出警报。有意义吗? 但实际上不可能弹出对话框?它是否正确?因为我想弹出一个框来说明错误。 我不确定在你的具体情况下有什么可用的,但你可以使用或实现类似于Bootstrap's modal component 的东西。这将为您提供您正在寻找的 UI 反馈,并满足 ESLint。 是的,我考虑过引导程序,但我不能使用它。如果有帮助,我可以使用 jquery。【参考方案2】:

有些 ESLint 规则并不适合包含在每个项目中,no-alert 绝对是其中之一。虽然批评者可能会说 alert 很突兀,但这并不能说明 突兀可以是好的事实!

要禁用此规则,请在您的 ESLint 配置文件中通过将其设置为“关闭”来禁用它。

...
"rules": 
    ...
    "no-alert": "off",
    ...

ESlint: Turning off a specific rule across a project

【讨论】:

以上是关于ESLint Disallow Use of Alert (no-alert)的主要内容,如果未能解决你的问题,请参考以下文章

You may use special comments to disable some warnings. Use // eslint-disable-next-line……

扩展 eslint-config-react-app 时 no-use-before-define 无效

无法加载在 'package.json » eslint-config-react-app' 中声明的插件 'flowtype':找不到模块 'eslint/use-at-your-own-risk'

vue——解决“You may use special comments to disable some warnings. Use // eslint-disable-next-line to ig

vue运行报错--eslint

又被ESLint 调戏了!!! ESLint:Newline required at end of file but not found. eslint(eol-last) [12, 22]