Project integration
Overview
The vapi init
command intelligently integrates Vapi into your existing codebase. It automatically detects your framework, installs the appropriate SDK, and generates production-ready code examples tailored to your project structure.
In this guide, you’ll learn to:
- Initialize Vapi in any project
- Understand what files are generated
- Customize the initialization process
- Work with different frameworks
Quick start
Navigate to your project directory and run:
The CLI will:
- Detect your project type and framework
- Install the appropriate Vapi SDK
- Generate example components and API routes
- Create environment configuration templates
- Provide next steps specific to your setup
How it works
Framework detection
The CLI analyzes your project structure to identify:
- Package files:
package.json
,requirements.txt
,go.mod
, etc. - Configuration files: Framework-specific configs
- Project structure: Directory patterns and file extensions
- Dependencies: Installed packages and libraries
What gets generated
Based on your framework, the CLI generates:
React/Next.js
Python
Node.js
Generated files:
components/VapiButton.tsx
- Voice call button componentpages/api/vapi/webhook.ts
- Webhook handler endpointlib/vapi-client.ts
- Vapi client setup.env.example
- Environment variables template
Installed packages:
@vapi-ai/web
- Web SDK for browser integration@vapi-ai/server-sdk
- Server SDK for webhooks
Supported frameworks
Frontend frameworks
- Create React App
- Vite
- Custom webpack
- Vue 3
- Nuxt.js
- Vite
- Angular 12+
- Ionic
- App Router
- Pages Router
- API Routes
- SvelteKit
- Vite
- HTML/CSS/JS
- Webpack
- Parcel
Mobile frameworks
- Expo
- Bare workflow
- iOS & Android
- Web support
Backend frameworks
- Express
- Fastify
- Koa
- Django
- FastAPI
- Flask
- Gin
- Echo
- Fiber
- Rails
- Sinatra
- Spring Boot
- Quarkus
- ASP.NET Core
- Blazor
Advanced options
Specify target directory
Initialize in a specific directory:
Skip SDK installation
Generate only example files without installing packages:
Force framework
Override auto-detection:
Custom templates
Use your own templates:
Environment setup
After initialization, configure your environment:
Common patterns
Adding to monorepos
For monorepos, run init in the specific package:
CI/CD integration
Add to your build process:
Docker environments
Include in your Dockerfile:
Troubleshooting
Framework not detected
If the CLI can’t detect your framework:
- Ensure you’re in the project root
- Check for required config files
- Use
--framework
flag to specify manually
Permission errors
For permission issues during SDK installation:
Existing files conflict
If files already exist, the CLI will:
- Ask for confirmation before overwriting
- Create backup files (
.backup
extension) - Show a diff of changes
Use --force
to skip confirmations:
Next steps
After initializing your project:
- Test locally: Use
vapi listen
to test webhooks - Create assistants: Build your first voice assistant
- Set up MCP: Enhance your IDE with Vapi intelligence
Example output: