{"type":"doc","content":[{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧨 Что такое "},{"type":"text","marks":[{"type":"code"}],"text":"global-error.tsx"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"В "},{"type":"text","marks":[{"type":"bold"}],"text":"Next.js"},{"type":"text","text":" файл "},{"type":"text","marks":[{"type":"code"}],"text":"app/global-error.tsx"},{"type":"text","text":":"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"ловит "},{"type":"text","marks":[{"type":"bold"}],"text":"ошибки рендера, data fetching, server components"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"работает "},{"type":"text","marks":[{"type":"bold"}],"text":"на уровне всего приложения"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"перекрывает любой layout"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"используется, когда "},{"type":"text","marks":[{"type":"bold"}],"text":"сломалось всё"}]}]}]},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧠 Иерархия ошибок (очень важно)"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Next.js ищет error boundary "},{"type":"text","marks":[{"type":"bold"}],"text":"снизу вверх"},{"type":"text","text":":"}]},{"type":"codeBlock","attrs":{"language":null},"content":[{"type":"text","text":"segment/error.tsx ← приоритет №1\nsegment/layout.tsx\n...\napp/global-error.tsx ← последний fallback\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"👉 Если "},{"type":"text","marks":[{"type":"bold"}],"text":"нет подходящего "},{"type":"text","marks":[{"type":"code"}],"text":"error.tsx"},{"type":"text","text":", используется "},{"type":"text","marks":[{"type":"code"}],"text":"global-error.tsx"},{"type":"text","text":"."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"📁 Где он лежит"}]},{"type":"codeBlock","attrs":{"language":"txt"},"content":[{"type":"text","text":"app/\n ├─ layout.tsx\n ├─ global-error.tsx ← только тут\n └─ page.tsx\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"⚠️ "},{"type":"text","marks":[{"type":"bold"}],"text":"Только в корне "},{"type":"text","marks":[{"type":"code"}],"text":"app/"},{"type":"hardBreak"},{"type":"text","text":"В сегментах "},{"type":"text","marks":[{"type":"code"}],"text":"global-error.tsx"},{"type":"text","text":" не работает."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧪 Минимальный пример"}]},{"type":"codeBlock","attrs":{"language":"tsx"},"content":[{"type":"text","text":"\"use client\";\n\nexport default function GlobalError({\n error,\n reset,\n}: {\n error: Error & { digest?: string };\n reset: () => void;\n}) {\n return (\n \n \n

Что-то пошло совсем не так 😬

{error.message}

\n \n \n \n );\n}\n"}]},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"Обязательные моменты"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"use client"},{"type":"text","text":" — "},{"type":"text","marks":[{"type":"bold"}],"text":"обязательно"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"должен возвращать "},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":" и "},{"type":"text","marks":[{"type":"code"}],"text":""}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"принимает:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"error"},{"type":"text","text":" — объект ошибки"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"reset()"},{"type":"text","text":" — повторный рендер сегмента"}]}]}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🔄 Что делает "},{"type":"text","marks":[{"type":"code"}],"text":"reset()"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"повторно рендерит приложение"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"повторяет "},{"type":"text","marks":[{"type":"code"}],"text":"fetch"},{"type":"text","text":", server components"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"полезно для "},{"type":"text","marks":[{"type":"bold"}],"text":"временных ошибок"},{"type":"text","text":" (сеть, API)"}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"❌ Какие ошибки ловит"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"✅ ошибки в Server Components"},{"type":"hardBreak"},{"type":"text","text":"✅ ошибки в Client Components"},{"type":"hardBreak"},{"type":"text","text":"✅ ошибки в "},{"type":"text","marks":[{"type":"code"}],"text":"fetch()"},{"type":"hardBreak"},{"type":"text","text":"✅ ошибки в layout/page/template"},{"type":"hardBreak"},{"type":"text","text":"❌ ошибки в "},{"type":"text","marks":[{"type":"bold"}],"text":"event handlers"},{"type":"text","text":" (onClick)"},{"type":"hardBreak"},{"type":"text","text":"❌ ошибки вне React lifecycle"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"(для кликов — try/catch)"}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧱 "},{"type":"text","marks":[{"type":"code"}],"text":"error.tsx"},{"type":"text","text":" vs "},{"type":"text","marks":[{"type":"code"}],"text":"global-error.tsx"}]},{"type":"table","content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null}}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"error.tsx"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"global-error.tsx"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Область"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"сегмент"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"всё приложение"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Частота"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"часто"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"очень редко"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"UI"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"локальный"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"аварийный"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Перекрывает layout"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"❌"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"✅"}]}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🎯 Когда НУЖЕН "},{"type":"text","marks":[{"type":"code"}],"text":"global-error.tsx"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"упала база данных"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"сломался auth middleware"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"ошибка в root layout"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"неожиданный runtime crash"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"production fallback"}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"❌ Когда НЕ нужен"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"ошибки конкретной страницы"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"валидация форм"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"бизнес-ошибки (404, forbidden)"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"UI-ошибки → "},{"type":"text","marks":[{"type":"code"}],"text":"error.tsx"}]}]}]},{"type":"paragraph","attrs":{"textAlign":null}}]}

Как работает global-error.tsx в Next JS?

Комментарии