Question

我正在使用 css 框架并像这样放置 cdns

//public <head> tag
<Helmet>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.6.15/dist/css/uikit.min.css" />
  <script src="https://cdn.jsdelivr.net/npm/uikit@3.6.15/dist/js/uikit.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/uikit@3.6.15/dist/js/uikit-icons.min.js"></script>
</Helmet>

组件内部示例

//Layout menu
<nav className="uk-navbar-container" data-uk-navbar="">
  <div className="uk-navbar-center">
    <ul className="uk-navbar-nav">
      <li><Link to="/">Home</Link></li>
      <li><Link to="/about">About</Link></li>
      <li><Link to="/request">Request</Link></li>
    </ul>
  </div>
</nav>
...

例如我收到错误

Warning: Prop `className` did not match. Server: "uk-navbar-container uk-navbar" Client: "uk-navbar-container"

UIkit JS 会在页面加载时调整 class (className)，我想保留它用于动画内容。那我试过了

// just add "uk-navbar" fixed the errors
<nav className="uk-navbar-container uk-navbar" data-uk-navbar="">
  <div className="uk-navbar-center">
    <ul className="uk-navbar-nav">
      <li><Link to="/">Home</Link></li>
      <li><Link to="/about">About</Link></li>
      <li><Link to="/request">Request</Link></li>
    </ul>
  </div>
</nav>
...

但实际上有很多需要查找来修复错误

如何关闭（忽略）Gatsby 中的错误（警告）？

Answer 1

Gatsby 默认带有默认的 ESLint 配置。正如您从 docs 中看到的：

<块引用>

Gatsby 带有内置的 ESLint 设置。对于大多数用户，我们的内置的 ESLint 设置就是你所需要的。然而，如果你知道你会喜欢自定义您的 ESLint 配置，例如你们公司有自己的自定义 ESLint 设置，这显示了如何做到这一点

要禁用 ESLint，只需在项目的根目录中创建一个空的 .eslintrc 文件。

忽略错误 className 与 Gatsby 中的服务器和客户端不匹配

1 个答案: