CODEWITHSUNDEEP
vaadin
arilanto
arilanto

Reputation: 1

Vaadin / load reactjs build

We develop a reactjs application which works fine, but one of our customer wants to load this application inside their vaadin environment. I thought sending them the reactjs build will be enough but for some reason they cannot load it : they use vaadin 14 and try to load the build script via @JsModule annotation and put a vaadin div component with the correct id (in order for reactjs to bootstrap it) but they say they hava this error :

Uncaught Error: Minified React error #200; visit https://reactjs.org/docs/error-decoder.html?invariant=200 for the full message or use the non-minified dev environment for full errors and additional helpful warnings

I dont know what's is going on here. Thanks

Upvotes: 0

Views: 139

Answers (1)

Sascha Ißbrücker
Sascha Ißbrücker

Reputation: 815

If you follow that link, you'll see that the full error message is:

Target container is not a DOM element.

It seems likely that when the script ran, the target Div did not exist yet. Using @JsModule means that the Vaadin application will include that module into its Javascript build, and run it as soon as the Vaadin application bootstraps in the browser. At that point in time there isn't anything related to the Vaadin application in the DOM yet.

One thing you could try is to change your script to expose a function (for example using a window global) to render the React application into the Div, rather than have the script render the React application immediately when the script runs. On the Vaadin side, your customer could then call that function as soon as the target Div has been added to the DOM, for example using executeJs in the components onAttach method.

Upvotes: 1

Related Questions