Animate.css: yarn add animate.css doesn't work

[Draichi]

Hey, i found a lilte bug,
When running yarn add animate.css the package is not imported (at least on dev mode)

The work around is: import it using cdn

Just wanna post it so anyone who face the same issue can see

thanks

[alishaevn]

npm install animate.css --save doesn't work either.
I'm working on an app with gatsby.js though, so importing using the cdn isn't possible.

[daneden]

Hey @Draichi/@alishaevn! You should be able to include animate.css on your page by require or importing it. For example, in Gatsby, you can import Animate.css in gatsby-browser.js to include it on every page, and then add the class names to elements:

// In gatsby-browser.js
import "animate.css"

// In src/pages/index.js
<h1 className="animate__animated animate__zoomInDown">Animated heading</h1>

Here’s a working example, set up by running npx gatsby new animate-css-test and inside the project yarn add animate.css:

• Live site
• gatsby-browser.js source
• src/pages/index.js source

[unikitty37]

Would it be worth mentioning this in the docs? They do kind of imply that running yarn add or npm install will be all you need to do 🙂

[snolangps]

~nextjs after adding import 'animate.css' still doesn't work :(~

nvm, its working...