Local Build Verification

⚠️ IMPORTANT: Always Build Locally Before Pushing

Building locally before pushing helps catch build errors early and prevents failed deployments.

Step-by-Step Build Process

1. Install Dependencies

# Ensure all dependencies are installed
yarn install

2. Run Linter

# Check for linting errors
yarn lint

Fix any linting errors before proceeding.

3. Build the Application

# Build the Next.js application
yarn build

What this does:

• Compiles TypeScript
• Validates all imports
• Checks for build-time errors
• Generates optimized production build
• Validates environment variables usage

4. Verify Build Output

After the build completes, check for:

✅ Success indicators:

✓ Compiled successfully
✓ Linting and checking validity of types
✓ Collecting page data
✓ Generating static pages
✓ Finalizing page optimization

❌ Error indicators:

• TypeScript errors
• Missing imports
• Environment variable issues
• Build-time errors

5. Test Production Build Locally (Optional)

# Start production server locally
yarn start

Visit http://localhost:3000 to verify the production build works correctly.

Common Build Errors to Watch For

Error Type	Cause	Solution
TypeScript errors	Type mismatches, missing types	Fix type errors
Module not found	Missing imports or dependencies	Check imports, run yarn install
Environment variable	Missing NEXT_PUBLIC_* variables	Add to .env.local or Vercel
Image domain	Unauthorized image domain	Add to next.config.mjs
Build timeout	Large bundle size	Optimize imports, code splitting

Quick Build Script

Create a pre-push hook or use this command sequence:

# Complete pre-push verification
yarn install && yarn lint && yarn build

If all commands succeed, you're ready to push!