Animated on Scroll /w Nuxt.js

There are very few articles out there on how to add the fabled AOS library to Nuxt.js.

Having looking into Nuxt as a way to power up my front-end skills, I thought it would be best show off what I found in case there is anyone out there in a similar predicament to myself.

For those of you out there, I hope this helps!

Firstly you’ll want to install Nuxt. The command below will suffice. All the information you need is contained right here!

https://nuxtjs.org/guide/installation

$ npx create-nuxt-app <project-name>

Secondly, once you have your project set up, you’ll want to create a files named “aos.js” inside the plugins folder and add the following code.

Once you have the aos.js file, take yourself over to the “nuxt.config.js” file and add the following code. Note that CSS and plugins already exist, you just need to update them.

And there you have it! You can now animate to your hearts content! But don’t forget to visit https://github.com/michalsnik/aos#animations first.