thanks to starter-kit-nuxt-locomotive-scroll nuxt v2 by DidoMarchet

Nuxt Locomotive Scroll

A Nuxt module to easily integrate Locomotive Scroll into your Nuxt application.

• ✨  Release Notes
• 🏀 Online playground
• 📖  Documentation

Features

• 🚀  Easy to use
• 🎨  Customizable

Quick Setup

Install the module to your Nuxt application with one command:

npx nuxi module add locomotive-scroll

That's it! You can now use Nuxt Locomotive Scroll in your Nuxt app ✨ or you can install it manually:

# npm
npm install nuxt-locomotive-scroll

# yarn
yarn add nuxt-locomotive-scroll

# pnpm
pnpm add nuxt-locomotive-scroll

and add nuxt-locomotive-scroll to the modules section of nuxt.config.

export default defineNuxtConfig({
  modules: [
    'nuxt-locomotive-scroll',
  ],
})

Usage

Just add v-locomotive directive to the element you want to animate.

<template>
  <div v-locomotive>
    <!-- Your content here -->
  </div>
</template>

you can check the playground for more examples.

Contribution

Local development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release