通过 100 多个技巧学习 Nuxt!

locomotive-scroll
nuxt-locomotive-scroll

一个 Nuxt 模块,可以轻松将 Locomotive Scroll 集成到您的 Nuxt 应用程序中。

感谢 starter-kit-nuxt-locomotive-scroll nuxt v2DidoMarchet 提供

Nuxt Locomotive Scroll

一个 Nuxt 模块,可以轻松将 Locomotive Scroll 集成到您的 Nuxt 应用程序中。

npm versionnpm downloadsLicenseNuxt

特性

  • 🚀  易于使用
  • 🎨  可定制

快速设置

使用一个命令将模块安装到您的 Nuxt 应用程序中

npx nuxi module add locomotive-scroll

就是这样!现在您可以在您的 Nuxt 应用程序中使用 Nuxt Locomotive Scroll 了 ✨ 或者您可以手动安装它

# npm
npm install nuxt-locomotive-scroll

# yarn
yarn add nuxt-locomotive-scroll

# pnpm
pnpm add nuxt-locomotive-scroll

并将 nuxt-locomotive-scroll 添加到 nuxt.configmodules 部分。

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

用法

只需将 v-locomotive 指令添加到您想要动画的元素上即可。

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

您可以查看 演示 以获得更多示例。

贡献

本地开发
# 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