Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

The current instructions for embedding reactpy do not appear to work #1216

Unanswered
AjBreidenbach asked this question in Problem
Discussion options

The problem

The current instructions (from https://github.com/reactive-python/reactpy/blob/main/docs/source/guides/getting-started/_static/embed-doc-ex.html) are:

<div id="reactpy-app" />
<script type="module">
 import { mountLayoutWithWebSocket } from "https://esm.sh/@reactpy/client";
 mountLayoutWithWebSocket(
 document.getElementById("reactpy-app"),
 "wss://reactpy.dev/_reactpy/stream?view_id=todo"
 );
</script>

When I attempt to do the same, I get the following console error:

Uncaught SyntaxError: The requested module 'https://esm.sh/@reactpy/client' does not provide an export named 'mountLayoutWithWebSocket' 

Website documentation is out of sync with new-docs branch

The same embedding snippet is present here, but appears to have been removed from the docs in d0e3628
https://reactpy.dev/docs/guides/getting-started/running-reactpy.html#embed-in-an-existing-webpage

Looking at the CDN

https://esm.sh/@reactpy/client@0.3.1

/* esm.sh - @reactpy/client@0.3.1 */
import "/stable/react@17.0.2/es2022/react.mjs";
import "/v135/react-dom@17.0.2/es2022/react-dom.mjs";
import "/v135/event-to-object@0.1.2/es2022/event-to-object.mjs";
import "/v135/json-pointer@0.6.2/es2022/json-pointer.mjs";
export * from "/v135/@reactpy/client@0.3.1/es2022/client.mjs";

https://esm.sh/v135/@reactpy/client@0.3.1/es2022/client.mjs appears to have only the following exports

export{b as BaseReactPyClient,y as Element,O as Layout,T as SimpleReactPyClient,d as createAttributes,m as createChildren,R as loadImportSource,ue as mount}

What will probably work for most people

Running the debugger and checking out the definitions in the sourcemap, I assume this is what we're supposed to do now:

 <script type="module">
 import {SimpleReactPyClient, mount} from "https://esm.sh/@reactpy/client"
 mount(document.querySelector('#app'), new SimpleReactPyClient({}))
 </script>
You must be logged in to vote

Replies: 1 comment

Comment options

It would probably make sense to have a different description, but I suppose this would be a subtask of #863

You must be logged in to vote
0 replies
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
1 participant

AltStyle によって変換されたページ (->オリジナル) /