I found it, wp-element. The @wordpress/scripts
should handle the heavy lifting of transforming the JSX in the proper way.
add_action( 'wp_enqueue_scripts', 'my_enqueue_plugin_js' ); // Loads on frontend
function my_enqueue_plugin_js() {
wp_enqueue_script(
'my-plugin-frontend',
plugin_dir_url( __FILE__ ) . 'js/plugin.js',
['wp-element']
);
}
Once we do this we will have window.wp.element available in our JavaScript. This contains the ReactDOM render() function as well as createElement() if you wanted to write React without JSX.
Related Posts:
- How to target block variations with has_block()?
- Dequeue Gutenburg Block Library CSS (‘wp-block-library’) in Admin
- How can I render a built-in Gutenberg block with InnerBlocks outside of the block editor?
- What is the proper way of using React Hooks in Gutenberg on frontend?
- How to add Gutenberg editor on frontend page?
- How to dynamically add style tags to Gutenberg editor in react
- How to implement Mapbox GL JS with a custom Gutenberg block in FSE?
- Removing Default Panels From Gutenberg Document Setting Panel (sidebar)
- Gutenberg Dev – React Context.Provider returns undefined
- Avoid automatic scroll jump when dragging a resize handle in a Gutenberg block
- Implementation of React-Datepicker component with Gutenberg in WordPress
- How can i extend the existing Block Inspector Tabs in WordPress Gutenberg Editor?
- Get realtime title and featured image value in WordPress block
- How to get block editor block inspector attribute value in my react block
- Detecting whenever a user types – in the Gutenberg editor, and checking if there is a preceding or succeeding – then converting both to an em dash
- Gutenberg Static blocks: viewScript doesn’t import css for frontend?
- Load CSS/Javascript in frontend conditionally if block is used
- Where can I find the Gutenberg block icons?
- Add pre-publish conditions to the block editor
- How to filter or remove default panels in Gutenberg PrePublish Panel
- Deactivate Gutenberg tips forever – not Gutenberg
- How does Gutenberg handle translations in React?
- Add To Gutenberg Sidebar
- How to detect the usage of Gutenberg
- Integrate Gutenberg as a Standalone App
- Help Unregistering a Core Block Type in Gutenberg
- How do I register multiple blocks with block.json and register_block_type_from_metadata?
- Remove block styles in the Block Editor
- Disable Gutenberg text-Settings in all blocks
- How do I get the current post ID within a Gutenberg/Block Editor block?
- Looking for all available options of Gutenberg Block
- Possible to use @wordpress/create-block with multiple blocks?
- Are there ways to make the Gutenberg editor wider? And the HTML-block higher?
- How do I enqueue a script to run inside the Gutenberg editor?
- Blocks: set a default value for a TextControl
- gutenberg block – how to force update after attribute changed?
- What is the advantage of ‘register_block_type’ (the PHP function) when creating custom blocks?
- How to trigger JS in gutenberg page load
- Allow excerpt for pages in Gutenberg?
- WordPress Gutenberg Embed Blocks Are Not Responsive
- Is there a list / reference for all current native WordPress blocks?
- Gutenberg: Block validation failed
- Set fullscreen mode by default
- How to query multiple post types inside Gutenberg options panel?
- How can I add a custom attribute to Gutenberg core blocks?
- Gutenberg extend core blocks
- Setting default font family with theme.json
- How can I access core/paragraph textColor in a block template
- (Gutenberg Block Editor) Using editor.BlockEdit filter, need to alter html/ CSS class of BlockEdit Component
- Add Button To Top Toolbar in Gutenberg
- Saving post meta using the new EntityProvider APIs
- Disable device preview options in the block editor
- Add additional classes to gutenberg .editor-styles-wrapper
- Implementing Gutenberg RichText onSplit / onReplace
- Change order/position of Gutenberg inspector control panel
- Get the current block ID
- Gutenberg Inspector Controls
- How to use the WordPress < LinkControl /> Component
- What version of Gutenberg is included with WordPress?
- Implement Panel Color Inspector Control in Gutenberg
- Add Formatting Buttons to Gutenberg core/paragraph BlockControls
- How do you use __experimentalLayout to give innerblocks alignment control and default layout?
- WordPress Value of Undefined in Admin
- Remove border radius setting from the Gutenberg button block?
- Extending Gutenberg group block: How to properly combine multiple attributes?
- serialize_blocks breaking html tags in content
- All post types with getEntityRecords
- gutenberg dynamic block is returning 404
- Modify the core/paragraph block
- Add PHP block template to content using wp_insert_post
- The Block Editor: Disable “Color settings” in the specific block
- Required (mandatory) Gutenberg block
- How to use getBlockIndex
- Gutenberg reusable blocks – is it possible to customise an instance?
- Gutenberg InspectorControls is deprecated, how to add custom block settings?
- Add classname to Gutenberg block wrapper in the editor?
- Hide or show Gutenberg custom block using date range
- How to disallow a certain custom gutenberg block outside of an InnerBlocks block?
- How should you internationalize javascript spread in multiple files but build in one?
- Use page Title in Gutenberg custom banner block
- How to add code to `head` with WordPress 5.9 FSE (Full Site Editing)
- Why is onChange={ ( content ) => setAttributes( { content } )} now used?
- Serialize custom block with InnerBlock
- How to develop custom blocks without triggering validation errors
- Dynamic gutenberg block with react instead of php
- get selected categories or tags (using javascript) in GutenBerg?
- File structure and react setup when creating multiple Gutenberg blocks
- Block Editor: add an aria-label to an option inside a SelectControl
- WordPress Gutenberg blocks: Input fields are not editable
- Gutenberg withInstanceId. When to use it?
- Gutenberg: Get All Attributes From «core/image» Block
- What replaces wpColorPicker in Gutenberg?
- How to make the Preview button automatically open new tab?
- Help with using getBlockIndex
- How to set column widths in a CPT block template?
- Gutenberg: How can I disable backspace key from deleting an empty paragraph block?
- Access GutenBerg data with Javascript?
- Gutenberg moving core blocks between categories
- Only show focused toolbar for Gutenberg Block with Multiple text fields
- Gutenberg: How to Change Post Status Programmatically?