jsx rendering fails with 'createRoot is not a function'

New To Observable
1

I only started working with the Observable Framework a week ago but I have been loving it thus far.
The documentation provided was always super helpful and I was able to create great notebooks with all the supported built-in features.

However, I have a use case where jsx might be the way to go, but when following even the simplest example from the documentation like:

function Greeting({subject}) {
  return <p>Hello, <b>{subject}</b>!</p>
}

display(<Greeting subject="JSX" />);

The code is not being rendered and in my browser’s console I can see the error: TypeError: createRoot is not a function

Which confuses me, cause I am on version v1.13.0, so jsx support should be enabled. Maybe I am missing something obvious here, but I would be happy if anyone has any suggestions.

2

React 19 broke ES module imports. We have applied a fix but we have not yet released a new version of Framework. You can find a workaround in this thread:

If you have further questions, please continue the existing discussions on GitHub. Thank you.

3 Likes
3

@mbostock thanks Mike, your are a legend!

1 Like