React Loading

[bianquijulian]

Hi, I am trying to implement react on the front end of a site, and I am forced to load everything from a cdn (react, react dom, babel), is there any way to be able to use the same react components as gutenberng in the front end? Any suggest?

[SergeyBiryukov]

Hi there, welcome to WordPress Trac! Thanks for the ticket.

Please note that this Trac is used for enhancements and bug reporting for the WordPress core software, not for individual support or development questions.

Please try the support forums to get help with your site: ​https://wordpress.org/support/forums/.

[apedog]

Replying to SergeyBiryukov:

Please note that this Trac is used for enhancements for the WordPress core software, not for individual support or development questions.

This is an enhancement request. To be able to load blocks/template-parts via React on the front-end.
If there are technical or design reasons why this might not be implemented in core - then that can be discussed in this ticket.
But it's not an invalid ticket.

[desrosj]

invalid is an ​unfortunately named ticket resolution that includes a handful of scenarios, including tickets that are actually support requests, or where there are no actions that can be taken.

@bianquijulian is asking about how to "implement react on the front end of a site" without having to load everything from a CDN (specifically mentioning React, ReactDOM and Babel), and using the same React components as the block editor.

As I interpret this request, the desire is to load React, ReactDOM and Babel on the front end, which is not an enhancement suggestion. This can be accomplished using wp_enqueue_script( 'react-dom' ) (which loads React as a dependency). Babel is not packaged with Core because it is a code compiler and should not be loaded on the front end of sites.

If this is not what your question is @bianquijulian then feel free to provide more information. The block editor has been used on the front-end in many other projects by enqueuing the necessary packages. So I'm not sure specifically what would not be possible here.