Installation

Add nanime with one nuxi command, or install and register it by hand.

Add it with nuxi

nuxi installs the package and adds nanime to modules in nuxt.config.ts.

npx nuxi module add nanime

pnpm dlx nuxi module add nanime

bun x nuxi module add nanime

Install it by hand

npm install nanime

pnpm add nanime

bun add nanime

export default defineNuxtConfig({
  modules: ['nanime']
})

No other setup is needed. The composables, <AnimeTransition>, <AnimeTransitionGroup> and <AnimeLayoutGroup> now work in every component without an import. Configuration covers turning auto-imports off and adding your own transition styles.

Use with AI agents

Install the agent skill

The skill teaches your coding agent the nanime composables and transition components. With it, the agent calls useAnimate() instead of calling animate() inside onMounted.

npx skills add astraldev/nanime --skill nanime

Connect the docs MCP server

The MCP server lets the agent search these docs itself.

claude mcp add --transport http nanime https://nanimejs.netlify.app/mcp

{
  "mcpServers": {
    "nanime": { "url": "https://nanimejs.netlify.app/mcp" }
  }
}

{
  "servers": {
    "nanime": { "type": "http", "url": "https://nanimejs.netlify.app/mcp" }
  }
}

Share the docs as plain text

For an agent without MCP, paste the URL of /llms-full.txt (every page in one file) or /llms.txt (an index of links) into the chat.