如何在Create React App中不显示警告

时间:2018-02-09 21:17:17

标签: reactjs webpack create-react-app

我在Facebook上使用create-react-app,当它通过  npm start'它显示了一个警告列表,例如:

'布拉'已定义但从未使用过 期待' ==='而是看到' =='

我不想看到任何这些警告,是否有办法压制它们?

11 个答案:

答案 0 :(得分:7)

对于本地Eslint,将文件添加到名为.eslintignore的项目中,并添加您要忽略的所有目录或文件:

build/
src/
*.js

虽然此时您可能完全删除它。

如果您使用create-react-app,则无法构建或启动代码。没有弹出就无法禁用Eslint,因为它内置于react-scripts中。无论何时构建或启动服务器,除了package.json中定义的特殊情况外,它将使用其内部配置运行eslint。唯一的解决方法是使用其他地方提到的禁用注释弹出或添加每个文件。有关详细信息,请参阅this issue on Github

答案 1 :(得分:6)

这些警告来自eslint。要禁用它们,请在文件顶部添加/* eslint-disable */,您不想遵循eslint规则。

答案 2 :(得分:2)

最近添加了添加自己的编辑器配置的功能,该功能可用于“部分”禁用ESLint的功能。您只需要在根目录中创建一个配置文件。

.eslintrc

{
  "parser": "babel-eslint"
}

.env

SKIP_PREFLIGHT_CHECK=true

如果您创建新的应用程序,则默认情况下 会在eslintConfig

中附带一个预填充的package.json对象

答案 3 :(得分:2)

对于特定的eslint警告抑制,在文件开头插入以下代码。

/* eslint-disable react/no-direct-mutation-state */

答案 4 :(得分:2)

我的代表不够高,无法评论@fly的出色答案,因此我将对其进行C + P添加以代替它:

对于正在寻找临时但快速有效的解决方案来从DevTools禁用控制台警告的人来说,这可以解决问题。

免责声明-这可能不适用于非我的版本(react-scripts v3.0.1,react-dev-utils @ ^ 9.0.1),因此使用此方法后果自负。

  • 输入此目录

node_modules/react-dev-utils/webpackHotDevClient.js

  • 寻找此功能(应该在114行附近)

function handleWarnings(warnings) {

  • 或者在return的开头添加function printWarnings()(第124行),或者在第145行中注释掉对printWarnings()的呼叫。

  • 例如使用npm run start重新启动以使更改生效。

通过这种方式,热加载器继续工作,但是已经在我的编辑器中捕获的恼人警告 不会在浏览器中输出。

答案 5 :(得分:2)

如果你想在 DevTools 中禁用警告

  1. 打开控制台标签。
  2. 默认级别/自定义级别 -> 取消选中警告

enter image description here

答案 6 :(得分:1)

要完全删除eslint警告,您可以做的是创建一个名为 .eslintignore add *的文件并保存。您不会再看到任何警告。

*

要从特定文件夹中删除警告,意味着在 .eslintignore 文件中添加该文件夹名称

/folder_name
/folder_name/file_name.js

您也可以在文件级别执行此操作。在文件开头添加以下内容

/* eslint-disable */ 

忽略文件中的下一行警告

// eslint-disable-next-line 

答案 7 :(得分:0)

对于寻求临时但快速有效的解决方法来禁用DevTools中的控制台警告的用户, 这可能会解决问题。

免责声明-这可能不适用于非我的版本(react-scripts v3.0.1,react-dev-utils @ ^ 9.0.1), 因此,使用它需要您自担风险。

  1. 输入此目录

    node_modules / react-dev-utils / webpackHotDevClient.js

  2. 查找此功能(应该在第114行附近)

    function handleWarnings(warnings){

,然后在其后添加return语句。

您的代码应该最终看起来像这样(如果您使用的是Webstorm) bye warnings

那应该立即关闭webpackHotDevClient.js:{whateverLineIdontCare}。 干杯。

答案 8 :(得分:0)

这是避免在调试时看到未使用的变量警告的一种简单方法:

import someVariable from "./wherever"

// Prevent unused variable warnings
while (false) {
 console.log(someVariable)
}

答案 9 :(得分:0)

添加一个.eslintignore文件并添加

src/*

您可以在

阅读更多相关信息
  1. https://eslint.org/docs/user-guide/configuring/ignoring-code
  2. https://eslint.org/docs/user-guide/configuring/rules

答案 10 :(得分:0)

设置 DISABLE_ESLINT_PLUGIN 环境变量:

DISABLE_ESLINT_PLUGIN=true npm start