S
Solo Kit
DocumentationComponentsPricingChangelogRoadmapFAQContact
LoginGet Started
DocumentationComponentsPricing
LoginGet Started
Welcome to Solo Kit DocumentationIntroductionTech StackRoadmapFAQGetting Started
Getting Started

Troubleshooting

Troubleshooting Guide

This comprehensive guide covers common issues you might encounter while developing with Solo Kit, along with step-by-step solutions.

🚨 Installation Issues

Node.js Version Errors

Error Message:

Error: This package requires Node.js version 18 or higher
The current version of Node.js is v16.14.0

Solution:

# Check current version
node --version

# Install Node.js 18+ using nvm (recommended)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
nvm install --lts
nvm use --lts

# Or download from nodejs.org
# https://nodejs.org/

# Verify installation
node --version  # Should show v18+

pnpm Not Found

Error Message:

pnpm: command not found

Solution:

# Install pnpm globally
npm install -g pnpm

# Alternative: using corepack (Node.js 16+)
corepack enable
corepack prepare pnpm@latest --activate

# Verify installation
pnpm --version

Permission Errors (macOS/Linux)

Error Message:

EACCES: permission denied, mkdir '/usr/local/lib/node_modules'

Solution:

# Don't use sudo! Fix npm permissions instead
mkdir ~/.npm-global
npm config set prefix '~/.npm-global'

# Add to your shell profile (.bashrc, .zshrc, etc.)
export PATH=~/.npm-global/bin:$PATH

# Or use Node Version Manager (recommended)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash

🗄️ Database Issues

Database Connection Failed

Error Message:

Error: Connection terminated unexpectedly
Error: password authentication failed for user "postgres"

Solutions:

1. Check DATABASE_URL format:

# Correct format
DATABASE_URL="postgresql://username:password@host:port/database?sslmode=require"

# Common format errors:
❌ Missing password: postgresql://username@host/database
❌ Wrong port: postgresql://username:password@host:5433/database
❌ Missing sslmode for cloud databases

2. Verify database server:

# For local PostgreSQL
brew services start postgresql@15  # macOS
sudo systemctl start postgresql    # Linux

# For cloud databases, check:
# - Database is running in provider dashboard
# - IP whitelist includes your IP
# - SSL/TLS settings match connection string

3. Test connection:

# Test with psql
psql "$DATABASE_URL"

# Or check via debug panel
curl http://localhost:3000/debug

Schema Push Failures

Error Message:

Error: relation "users" already exists
Error: column "new_column" already exists

Solutions:

# Reset database (CAUTION: Deletes all data)
pnpm db:reset

# Or use migrations for production
pnpm db:generate  # Generate migration files
pnpm db:migrate   # Apply migrations

# Force schema sync (development only)
pnpm db:push --force

Drizzle Studio Not Loading

Error Message:

Cannot connect to database
Error: Failed to start Drizzle Studio

Solutions:

# Check if port 4983 is available
lsof -ti:4983 | xargs kill

# Restart Drizzle Studio
pnpm db:studio

# Check environment variables
echo $DATABASE_URL  # Should not be empty

# Verify database connection first
pnpm db:push

🔧 Development Server Issues

Port Already in Use

Error Message:

Error: Port 3000 is already in use
Error: listen EADDRINUSE: address already in use :::3000

Solutions:

# Find and kill process using port 3000
lsof -ti:3000 | xargs kill

# Or find the specific process
lsof -i :3000

# Use different port
PORT=3001 pnpm dev

# Kill all Next.js processes
pkill -f "next dev"

Hot Reloading Not Working

Problem: Changes not reflecting in browser

Solutions:

# 1. Clear Next.js cache
rm -rf .next/
pnpm dev

# 2. Clear all caches
pnpm clean
pnpm install
pnpm dev

# 3. Check file watching limits (Linux)
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf
sudo sysctl -p

# 4. Disable browser cache
# Open DevTools → Network → Check "Disable cache"

Build Cache Issues

Error Message:

Error: Module not found
Error: Cannot resolve module

Solutions:

# Clear all caches
rm -rf .next/
rm -rf node_modules/.cache/
rm -rf apps/web/.turbo/

# Reinstall dependencies
pnpm install

# Rebuild shared packages
pnpm build:packages

# Full reset
pnpm clean
pnpm install
pnpm dev

📦 TypeScript Issues

Module Resolution Errors

Error Message:

Cannot find module '@/components/Button' or its corresponding type declarations
Cannot find module '@packages/ui' or its corresponding type declarations

Solutions:

1. Check tsconfig.json paths:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./apps/web/*"],
      "@packages/ui": ["./packages/ui/src"],
      "@packages/utils": ["./packages/utils/src"],
      "@packages/database": ["./packages/database/src"]
    }
  }
}

2. Build shared packages:

# TypeScript needs compiled packages for type checking
pnpm build:packages

# Then run type checking
pnpm type-check

3. Restart TypeScript server:

# In VS Code: Cmd/Ctrl + Shift + P
# Type: "TypeScript: Restart TS Server"

# Or restart your editor

Type Declaration Issues

Error Message:

Property 'user' does not exist on type 'Session'
Type 'string | undefined' is not assignable to type 'string'

Solutions:

# 1. Check type definitions
cat packages/database/src/schema/index.ts
cat lib/types/auth.types.ts

# 2. Regenerate types after schema changes
pnpm db:push
pnpm build:packages

# 3. Clear TypeScript cache
rm -rf node_modules/.cache/
rm tsconfig.tsbuildinfo
pnpm type-check

Build Errors After Package Changes

Error Message:

Error: Build failed because of TypeScript errors
Cannot find module or its corresponding type declarations

Solutions:

# Always rebuild packages before type checking
pnpm build:packages
pnpm type-check

# Or use the comprehensive CI command
pnpm ci

🎨 Styling and UI Issues

Tailwind CSS Not Loading

Problem: Classes not being applied, styles missing

Solutions:

# 1. Check Tailwind config
cat tailwind.config.ts

# 2. Verify content paths include your files
content: [
  "./pages/**/*.{js,ts,jsx,tsx,mdx}",
  "./components/**/*.{js,ts,jsx,tsx,mdx}",
  "./app/**/*.{js,ts,jsx,tsx,mdx}",
  "./packages/ui/src/**/*.{js,ts,jsx,tsx}",
],

# 3. Restart dev server
pnpm dev

# 4. Clear CSS cache
rm -rf .next/
pnpm dev

shadcn/ui Component Issues

Error Message:

Error: Cannot find module './ui/button'
Component is not rendering correctly

Solutions:

# 1. Check if component is installed
ls components/ui/

# 2. Add missing components
pnpm ui add button
pnpm ui add card input

# 3. Check component imports
# Should be: import { Button } from "@/components/ui/button"
# Not: import { Button } from "@packages/ui"

# 4. Update existing components
pnpm ui update

CSS Modules Not Working

Problem: Styles not applying, className showing as string

Solutions:

# 1. Check file naming (.module.css)
components/Header.module.css  # ✅ Correct
components/header.css         # ❌ Won't work as module

# 2. Check import syntax
import styles from './Header.module.css';  # ✅ Correct
import './Header.css';                     # ❌ Global styles

# 3. Restart development server
pnpm dev

📱 Mobile Development Issues

Expo/React Native Issues

Error Message:

Error: expo command not found
Metro bundler error

Solutions:

# 1. Install Expo CLI globally
npm install -g @expo/cli

# 2. Clear Metro cache
pnpm --filter mobile expo start --clear

# 3. Reset Metro bundler
rm -rf apps/mobile/node_modules/.cache/
pnpm --filter mobile install

# 4. Check mobile app setup
cd apps/mobile
ls app.config.js  # Should exist

Device Connection Issues

Problem: Can't connect to development server from device

Solutions:

# 1. Check network connectivity
# Ensure device and computer on same network

# 2. Check firewall settings
# Allow connections to port 8081 (Metro) and 19000 (Expo)

# 3. Use tunnel mode (slower but more reliable)
pnpm --filter mobile expo start --tunnel

# 4. Check IP address
ifconfig | grep inet  # macOS/Linux
ipconfig              # Windows

🔍 Performance Issues

Slow Build Times

Problem: Build takes too long, development feels sluggish

Solutions:

# 1. Use changed-files-only commands during development
pnpm lint:changed      # Instead of pnpm lint
pnpm type-check:changed # Instead of pnpm type-check

# 2. Clear caches
pnpm clean
pnpm install

# 3. Check system resources
top    # CPU usage
free   # Memory usage (Linux)
df -h  # Disk space

# 4. Optimize build
# Ensure .gitignore includes build artifacts
echo ".next/" >> .gitignore
echo "dist/" >> .gitignore

Memory Issues

Error Message:

JavaScript heap out of memory
Error: Cannot allocate memory

Solutions:

# 1. Increase Node.js memory limit
NODE_OPTIONS="--max-old-space-size=4096" pnpm build

# 2. Close unnecessary applications
# Check Activity Monitor (macOS) or Task Manager (Windows)

# 3. Use changed-files-only commands
pnpm lint:changed
pnpm type-check:changed

# 4. Split large files
# Break down large components into smaller ones

🌐 Network and API Issues

API Route Errors

Error Message:

404 - Not Found
500 - Internal Server Error

Solutions:

# 1. Check API route file structure
app/api/users/route.ts      # ✅ Correct
app/api/users.ts            # ❌ Wrong location
pages/api/users.ts          # ❌ Old Pages Router

# 2. Check HTTP method exports
export async function GET(request: NextRequest) { ... }
export async function POST(request: NextRequest) { ... }

# 3. Test API directly
curl http://localhost:3000/api/users
curl -X POST http://localhost:3000/api/users -d '{"name":"test"}'

# 4. Check server logs
pnpm dev  # Check terminal for error messages

CORS Issues

Error Message:

Access to fetch at 'api/users' from origin 'http://localhost:3000' has been blocked by CORS policy

Solutions:

# 1. Use relative URLs for same-origin requests
fetch('/api/users')  # ✅ Correct
fetch('http://localhost:3000/api/users')  # ❌ Unnecessary

# 2. For external APIs, configure CORS in API route
export async function GET() {
  const response = NextResponse.json({ data });
  response.headers.set('Access-Control-Allow-Origin', '*');
  return response;
}

# 3. Use Next.js rewrites for external APIs
// next.config.js
module.exports = {
  async rewrites() {
    return [
      {
        source: '/api/external/:path*',
        destination: 'https://external-api.com/:path*'
      }
    ];
  }
};

🔐 Authentication Issues

Auth Session Problems

Error Message:

User not authenticated
Session expired

Solutions:

# 1. Check auth configuration
cat lib/auth.ts

# 2. Verify environment variables
echo $AUTH_SECRET        # Should not be empty
echo $AUTH_TRUST_HOST   # Should be true for development

# 3. Clear auth cookies
# In browser DevTools → Application → Cookies → Clear All

# 4. Check database auth tables
pnpm db:studio
# Verify user, account, session tables exist

# 5. Test auth flow
curl -c cookies.txt http://localhost:3000/api/auth/signin
curl -b cookies.txt http://localhost:3000/api/auth/session

OAuth Provider Issues

Error Message:

OAuthAccountNotLinked
Callback URL mismatch

Solutions:

# 1. Check OAuth provider configuration
# GitHub: Settings → Developer settings → OAuth Apps
# Google: Google Cloud Console → APIs & Services → Credentials

# 2. Verify callback URLs
# Should be: http://localhost:3000/api/auth/callback/[provider]
# Not: http://localhost:3000/auth/callback/[provider]

# 3. Check environment variables
echo $GITHUB_CLIENT_ID
echo $GITHUB_CLIENT_SECRET
# Should not be empty

# 4. Test OAuth flow manually
# Visit: http://localhost:3000/api/auth/signin/github

🚀 Deployment Issues

Vercel Deployment Errors

Error Message:

Build failed
Module not found in production

Solutions:

# 1. Test production build locally
pnpm build
pnpm start

# 2. Check environment variables in Vercel dashboard
# Ensure all required env vars are set

# 3. Check build logs
vercel logs [deployment-url]

# 4. Verify dependencies
# Ensure production dependencies are not in devDependencies

# 5. Check Next.js configuration
cat next.config.js  # Should not have development-only settings

Environment Variable Issues

Error Message:

ReferenceError: process is not defined
Environment variable not accessible

Solutions:

# 1. Check client vs server variables
# Client variables MUST be prefixed with NEXT_PUBLIC_
NEXT_PUBLIC_API_URL="https://api.example.com"  # ✅ Client accessible
DATABASE_URL="postgresql://..."                # ❌ Server only

# 2. Verify environment files
ls -la | grep .env
# Should see: .env, .env.local, .env.example

# 3. Check variable naming
echo $DATABASE_URL      # Server-side
echo $NEXT_PUBLIC_API_URL  # Client-side

# 4. Restart development server after env changes
pnpm dev

🛠️ Quick Diagnostic Commands

Health Check Commands

# System requirements
node --version     # Should be 18+
pnpm --version    # Should work
git --version     # Should work

# Project health
pnpm install           # Dependencies
pnpm build:packages    # Shared packages
pnpm type-check       # TypeScript
pnpm lint:changed     # Code quality
pnpm test             # Tests

# Services
pnpm dev              # Development server
pnpm db:studio        # Database connection
curl http://localhost:3000/debug  # Debug panel

Emergency Reset Commands

# Nuclear option - full reset
pnpm clean
rm -rf node_modules pnpm-lock.yaml
pnpm install
pnpm build:packages
pnpm dev

# Database reset (CAUTION: Deletes all data)
pnpm db:reset
pnpm db:seed

# Git reset (CAUTION: Loses uncommitted changes)
git reset --hard HEAD
git clean -fd

🆘 Getting Additional Help

Gathering Debug Information

When reporting issues, include:

# System information
node --version
pnpm --version
uname -a  # macOS/Linux
systeminfo  # Windows

# Project information
git status
git log --oneline -5
pnpm list --depth=1

# Error reproduction
# Step-by-step instructions
# Full error messages
# Screenshots if applicable

Common Debugging Steps

  1. Read the error message carefully - Often contains the solution
  2. Check the debug panel at http://localhost:3000/debug
  3. Clear caches with pnpm clean && pnpm install
  4. Restart development server with pnpm dev
  5. Check environment variables are properly set
  6. Build shared packages with pnpm build:packages
  7. Search existing issues on GitHub
  8. Create minimal reproduction if reporting new issues

Resources

  • Debug Panel: http://localhost:3000/debug - Real-time status
  • GitHub Issues: Search existing issues and create new ones
  • Documentation: Browse all documentation sections
  • Community Discord: Get help from other developers
  • Stack Overflow: Tag questions with solo-kit

Creating Bug Reports

Include these details:

## Environment
- OS: macOS 13.0
- Node: v18.17.0
- pnpm: 8.6.12
- Solo Kit: 0.7.1

## Steps to Reproduce
1. Run `pnpm dev`
2. Navigate to `/dashboard`
3. Click on user profile
4. Error appears

## Expected Behavior
User profile should load

## Actual Behavior
Error: Cannot read property 'name' of undefined

## Additional Context
- Happens only on fresh database
- Works fine after seeding data
- Console shows network error

🎯 Next Steps

With troubleshooting knowledge in hand:

  1. Database Guide - Master database operations
  2. Authentication - Secure user management
  3. API Development - Build robust APIs
  4. Deployment - Production deployment strategies

Most issues have simple solutions. Keep this guide handy and refer to it when you encounter problems during development.

On this page

Troubleshooting Guide🚨 Installation IssuesNode.js Version Errorspnpm Not FoundPermission Errors (macOS/Linux)🗄️ Database IssuesDatabase Connection FailedSchema Push FailuresDrizzle Studio Not Loading🔧 Development Server IssuesPort Already in UseHot Reloading Not WorkingBuild Cache Issues📦 TypeScript IssuesModule Resolution ErrorsType Declaration IssuesBuild Errors After Package Changes🎨 Styling and UI IssuesTailwind CSS Not Loadingshadcn/ui Component IssuesCSS Modules Not Working📱 Mobile Development IssuesExpo/React Native IssuesDevice Connection Issues🔍 Performance IssuesSlow Build TimesMemory Issues🌐 Network and API IssuesAPI Route ErrorsCORS Issues🔐 Authentication IssuesAuth Session ProblemsOAuth Provider Issues🚀 Deployment IssuesVercel Deployment ErrorsEnvironment Variable Issues🛠️ Quick Diagnostic CommandsHealth Check CommandsEmergency Reset Commands🆘 Getting Additional HelpGathering Debug InformationCommon Debugging StepsResourcesCreating Bug Reports🎯 Next Steps