rockiger

@turbojae Sorry, I meant a screenshot from the ReactPress admin page.
I am trying to figure out, if ReactPress still sees your app as a create-react-app.

Could you look into the content of the index.html? And search for var reactPress? It should be defined there.
If not look at the source of your WordPress page where you want to embed the React app. Is it present there?

Sorry, for coming back to you that late.

I looked into the code, to see what changed. Do you have a package.json file in your deployed React app?

Could you post a screenshot of the ReactPress admin? The only thing that changed is the way we the plugin determines what kind of React app it is dealing with. CRA, Vite, etc.

Do you use create-react-app or a custom solution to build your app? Or do you more than one app added to this page?

No, there shouldn’t be anything to do. From what version did you update? How do they not work?

Hm, it seems this is some weird behavior on WordPress’s part.

I have two ideas:

1. If you don’t need any subpages to your app, activate client-side in the ReactPress admin. Even if you don’t use some routing library. It tells WordPress to ignore the URL part after the permalink to the page.
2. Use a # before your parameters. Everything what comes after is ignored, because the browser think it is an anchor.

Hope this helps

Thank you! I changed the line.

Hm, this could be something I missed. Could you post an example of the querystring? Did you try to activate the routing option for your app?

The WordPress routing is pretty complex. I need to look into it, to see how it works.

I released a new version. That works as described above. But having 2 apps on one page is nothing I recommend nor officially support. Nonetheless, I got two apps working on one page.

I am still not sure that I understand the use case. I hope this helps.

Proxy configurations are not my area of expertise. Maybe activate client-side routing. Otherwise, WordPress will ‘catch’ that route.

You probably need to configure the proxy server differently. ReactPress changes the PUBLIC_URL environment variable in package.json, maybe this needs to be accounted for.

As I said, this was just a guess that could have worked.

I looked over the relevant code, and ReactPress only adds the necessary JavaScript for one app to the page. If there is more than one app added to a single page, it only shows the first app.
I’m still debating with myself whether to allow more than one app per page.

Cool, glad it helps you.

This could be possible. But you would need to test it.

Out off the top of my head, I would say you need to create 2 apps. Assign them to the same page. But you would have to set a second html-tag the second app could attach to.

Normally, React attaches to the <div id="root"></div>. You would need to add 2 divs.

<div id="root"></div>
<div id="root2"></div>

In the second React app this line needs to be edited accordingly:

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement // change to 'root2'
);

I don’t think you would speed up a homepage with a React app. A static WordPress site is way faster as React app.