Works a charm

Hi @bizzledapp

I’m trying to embed a react app using this plugin. I have been unsuccessful. I would greatly appreciate your assistance.

I have added the /build into the folder /public_html/mysite/ i.e /public_html/mysite/build/….

and added the shortcode to a page as follows;

[reactapp id=”root”
“/build/static/js/2.7feebc20.chunk.js”
“/build/static/js/main.f38130b1.chunk.js”
“/build/static/css/main.ced95cd8.chunk.css”
“/build/static/css/2.f42e59c9.chunk.css”
“/build/static/js/runtime-main.4099d682.js”
]

However, the react app does not run.

regards,

Hey @amarunda,

Hope you’re keeping well.

So two little tips here, firstly i would recommend renaming your js and css bundles. Reason being, you’ll then always be looking for the same filenames with the Shortcode element, meaning you only need to rename the build, rather than update the shortcode with the new .js and .css filenames.

Here is an example of something i have set up:

[reactapp id="root" 
"/mfe/static/js/1.js" "/mfe/static/js/2.js" "/mfe/static/js/3.js"]

The build folders are then placed within a directory nest as such:
/var/www/html/mfe/static/...

Also, be sure not to use new lines within the shortcode, i don’t think this gets on very well.

Hope this helps, mate.

Be safe,
Bizzle

Hi @bizzledapp

Thanks for you advice & tips. Unfortunately it has not worked for me. Maybe it because I’m on WP5.4

I have embedded the react app using a ‘quick & dirty’ way i.e adding a custom HTML <object> tag that links to the react app URL. However, I’m sure this is not best practise.

Will try to follow notes at https://www.digitalocean.com/community/tutorials/how-to-embed-a-react-application-in-wordpress-on-ubuntu-18-04

regards,

Arnold