fix(gatsby): Handle renderToPipeableStream errors

[tyhopp]

Description

Fixes errors that get swallowed during React 18's renderToPipeableStream.

Currently the error is logged (so at least there's some info), but the stack trace and code frame don't have it.

Example component with error:

import * as React from "react"
import { Link } from "gatsby"

const IndexPage = () => {
  // This is the error
  throw new Error(`Hello`)

  return <></>
}

export default IndexPage

Current stack trace and code frame:

ERROR #95313 

Building static HTML failed

See our docs page for more info on this error: https://gatsby.dev/debug-html


  107 |         route: route,
  108 |         params: params,
> 109 |         uri: "/" + uriSegments.slice(0, index).join("/")
      | ^
  110 |       };
  111 |       break;
  112 |     }


  WebpackError: Worker exited before finishing task
  
  - utils.js:109 
    [g]/[@gatsbyjs]/reach-router/lib/utils.js:109:1
  
  - attributes.js:73 
    [g]/[css-select]/lib/attributes.js:73:1

With change:

ERROR #95313 

Building static HTML failed for path "/"

See our docs page for more info on this error: https://gatsby.dev/debug-html


  4 | const IndexPage = () => {
  5 |   // This is the error
> 6 |   throw new Error(`Hello`);
    |         ^
  7 |
  8 |   return <></>;
  9 | };


  WebpackError: Hello
  
  - index.tsx:6 
    g/src/pages/index.tsx:6:9
  
  - utils.js:64 
    [g]/[@gatsbyjs]/reach-router/lib/utils.js:64:1

Documentation

N/A

Related Issues

[sc-55337]