Installation
Install Better Convex Nuxt and verify the generated Convex API alias.
This setup creates a Nuxt 4 app with Convex and the module. Authentication stays disabled until the later auth step.
Prerequisites
- Node.js
22.12+,24.11+, or26+ - A Convex account
- pnpm, npm, or another supported Node package manager
Create the applications
Create a Nuxt project if you do not already have one:
pnpm create nuxt@latest my-convex-app
cd my-convex-appInstall Convex and the module:
pnpm add convex better-convex-nuxtInitialize Convex:
pnpm exec convex devThe Convex CLI connects or creates a deployment, writes local environment values, creates convex/, and generates convex/_generated/api.
Keep convex dev running while developing backend functions.
Register the Nuxt module
export default defineNuxtConfig({
modules: ['better-convex-nuxt'],
convex: {
auth: false,
},
})The module reads NUXT_PUBLIC_CONVEX_URL first and falls back to CONVEX_URL. Set the public name explicitly when your deployment platform does not expose the Convex CLI environment file during the Nuxt build:
NUXT_PUBLIC_CONVEX_URL=https://your-deployment.convex.cloudDo not commit deployment credentials or auth secrets. A Convex deployment URL is public configuration; session tokens are not.
Prepare Nuxt types
pnpm exec nuxt prepareThe module registers:
#convex/api→ your generatedconvex/_generated/api#convex/server→ the supported Nuxt server entry- client composable auto-imports
- server helper auto-imports
Verify the API alias in a temporary component or page:
import { api } from '#convex/api'
console.log(api)If TypeScript reports that convex/_generated/api is missing, run pnpm exec convex dev or pnpm exec convex codegen.
Expected structure
my-convex-app/
├── app/
├── convex/
│ ├── _generated/
│ │ └── api.d.ts
│ └── tsconfig.json
├── .env.local
├── nuxt.config.ts
└── package.jsonNext, build the first real-time page.