How to Debug a Lovable Project

Overview

Debugging is a process, not an inspiration. The process works even when you do not understand the code.

Beginner explanation: You are narrowing down where the problem is before trying to fix it. Most wasted time comes from fixing the wrong thing.

Technical explanation: Reproduce reliably, read the browser console and network responses, form a single hypothesis, change one thing, and verify against the reproduction.

Steps

1. Write down the exact steps that reproduce the problem.
2. Open the browser console and note the first error, not the last.
3. Check the network tab for failed or empty responses.
4. Form one hypothesis and make one change.
5. Re-run your reproduction steps and record the result.

:::tip Paste the real error text into your fix prompt. Describing an error from memory loses the part that identifies it. :::

What to check afterwards

• The reproduction steps no longer produce the problem
• No new console errors appeared
• You can explain why the fix worked

Common problems

• Changing several things at once.
• Fixing the last error in the console instead of the first.
• Assuming the preview and the published site behave identically.

Where people get stuck

If you have followed the steps and the result still is not right, the fastest path is usually to describe the exact behaviour you expected, the behaviour you got, and any error text, then ask for a fix in one focused follow-up prompt. If that loop is not converging, hand it over.