Quick Start

Transform this noisy error:

TypeError: Cannot read property 'map' of undefined at Object.eval (webpack:///./src/components/UserList.js?:23:45)

Into this clear message:

Error: userList is undefined when calling userList.map()
Location: UserList.js, line 23
Fix: Check that userList prop is passed to component or provide default: userList?.map() or userList || []

Workflow

1. Extract core issue - Identify the actual problem from noise
2. Identify location - Find relevant file/line numbers
3. Determine cause - What likely went wrong
4. Provide fix - Specific action to resolve it
5. Add context - Brief explanation if helpful

Progress checklist for complex errors:

• Core error identified
• Noise/stack trace filtered
• Location pinpointed
• Root cause determined
• Actionable fix provided
• Additional context added if needed

Examples

Example 1: Input: ReferenceError: fetch is not defined at /home/user/app.js:45:12 at Module._compile (module.js:653:30) at Object.Module._extensions..js (module.js:664:10)

Output:

Error: fetch() is not available in Node.js
Location: app.js, line 45
Fix: Install node-fetch: npm install node-fetch
Then: const fetch = require('node-fetch')

Example 2: Input: Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application.

Output:

Warning: Component trying to update state after unmounting
Cause: Async operation (API call/timer) completing after component removed
Fix: Use cleanup function in useEffect:
useEffect(() => {
  let mounted = true;
  fetchData().then(data => {
    if (mounted) setState(data);
  });
  return () => mounted = false;
}, []);

Example 3: Input: Build failed with exit code 1. Module build failed: SyntaxError: Unexpected token < in JSON at position 0

Output:

Error: Trying to parse HTML as JSON
Cause: API endpoint returned HTML error page instead of JSON
Fix: Check API endpoint URL and server status
Debug: Console.log the response before JSON.parse()

Best Practices

• Lead with the problem - State what's broken first
• Be specific about location - Exact file and line when possible
• Provide copy-paste solutions - Actual code fixes, not just descriptions
• Address root cause - Don't just fix symptoms
• Use consistent format - Error/Location/Fix/Context structure
• Include debugging steps - Help developers investigate further

Common Pitfalls

• Don't just remove technical terms - developers need them
• Don't oversimplify - maintain necessary technical detail
• Don't assume skill level - provide fix AND explanation
• Don't ignore stack traces completely - they contain useful location info
• Don't provide generic advice - be specific to the actual error
• Don't forget to preserve error codes/types that matter for debugging