我使用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默认带有一个默认的ESLint配置。从文档中可以看到:
Gatsby附带了一个内置的ESLint设置。对于大多数用户来说，我们的内置的ESLint设置是你所需要的。如果你知道，你会喜欢自定义你的ESLint配置，例如你的公司有他们自己的自定义ESLint设置，这显示了如何完成
要禁用ESLint，只需在项目的根目录下创建一个空的.eslintrc文件。