News for hackers. Stuff that matters.

A comment on Ask HN: What problem are you close to solving and how can we help?.

Re:Ask HN: What problem are you close to solving and how can... by pollomarzo on Sunday August 29, 2021 @09:12AM (#28346410)
I'm looking for a way to integrate a React app with an existing Vue... thing. Don't really need any communication between the two, just displaying it would be fine. My issue is: the Vue code just throws in <script> tags in the html and expects global variables (location instead of window.location), while the React code uses ES6 imports. The only partly working way I found is including <script> tags with a useEffect, but that doesn't play nicely with apex-charts for some reason, and includes forcing the html with a dangerouslySetInnerHTML after importing the existing file as a long string. Sub par, obviously. In addition, I'll probably need to include different vue apps in a couple different instances. Any suggestions? I think I might just keep them separate and open a new tab for the explanatory session. thanks!

Reasoning: helping with the code behind a paper on explanatory AI systems.

Related code on github if curious https://github.com/pollomarzo/map-generation/tree/main/graph

EDIT: thanks for suggestions will give them a spin throughout tomorrow :)

[ Parent | on HN ]
Re:Ask HN: What problem are you close to solving and how can... by mindri0t on Sunday August 29, 2021 @09:36AM (#28346569)
Have you tried SingleSPA? I’ve used it in the past to get React apps inside an old AngularJS app to replace parts of it over time and it worked pretty well. Docs say it works with Vue as well but I don’t have any direct experience with Vue at all far less for this kind of task so I’m not really sure it will work but it is worth looking at https://single-spa.js.org/
[ Parent | on HN ]
Re:Ask HN: What problem are you close to solving and how can... by janderson215 on Sunday August 29, 2021 @09:41AM (#28346607)
Have you tried using `useRef` and attaching the Vue component to a parent React node? I haven’t does this with Vue, but have with a vanilla JS chart library.
[ Parent | on HN ]
Re:Ask HN: What problem are you close to solving and how can... by tyingq on Sunday August 29, 2021 @10:32AM (#28347007)
>just displaying it would be fine

Iframes with postmessage() where needed (like dynamic window size changes) isn't pretty, but it's easy to do.

[ Parent | on HN ]