I'm using css framework and place cdns like this
//public <head> tag
<Helmet>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/uikit.min.css" />
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/uikit-icons.min.js"></script>
</Helmet>
example inside the component
//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>
...
I'm getting the errors for example
Warning: Prop `className` did not match. Server: "uk-navbar-container uk-navbar" Client: "uk-navbar-container"
UIkit JS will adjust class (className) when the page load, and I want to keep that for animation stuff. Then I've tried
// 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>
...
But in reality there are so many to look up to fix the errors
How to turn off (ignore) the errors (warning) in Gatsby?
question from:
https://stackoverflow.com/questions/66057434/ignore-the-errors-classname-did-not-match-server-and-client-in-gatsby 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
