Crear un plugin con React

Crear con NPM como Brian Coords. Ejecutar el siguiente comando en la carpeta de wp-content/plugins de tu proyecto

npx @wordpress/create-block nameweb-core

/* para compilar */
npm install
npm run build

Esto compilará tu código JavaScript y lo colocará en el directorio build.

O hacer esta estructura de la carpeta y compilar

/nameweb-core
  /build
    /index.asset.php
  /src
    /index.js
  nameweb-core.php
  index.php
  package.json

Con el siguiente contenido:

{
  "name": "nameweb-core",
  "version": "1.0.0",
  "description": "Basic functionalities for the WordPress site, including the registration of Custom Post Types and taxonomies, and additional metadata.",
  "main": "src/index.js",
  "scripts": {
    "build": "wp-scripts build",
    "start": "wp-scripts start"
  },
  "author": "Flavia Bernárdez Rodríguez",
  "license": "GPL-3.0-or-later",
  "devDependencies": {
    "@wordpress/scripts": "^25.0.0"
  }
}

import { registerPlugin } from '@wordpress/plugins';
import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
import { SelectControl } from '@wordpress/components';
import { useSelect, useDispatch } from '@wordpress/data';
import { __ } from '@wordpress/i18n';

const MetaFieldsPanel = () => {
    const { editPost } = useDispatch('core/editor');
    const meta = useSelect((select) =>
        select('core/editor').getEditedPostAttribute('meta')
    );

    const updateMeta = (key, value) => {
        editPost({ meta: { ...meta, [key]: value } });
    };

    return (
        <PluginDocumentSettingPanel
            name="meta-fields-panel"
            title={__('Meta Fields', 'lapd-core')}
            className="meta-fields-panel"
        >
            <SelectControl
                label={__('Arrow Position', 'lapd-core')}
                value={meta.arrow_position}
                options={[
                    { label: 'Top Left', value: 'top left' },
                    { label: 'Top Right', value: 'top right' },
                    { label: 'Bottom Left', value: 'bottom left' },
                    { label: 'Bottom Right', value: 'bottom right' },
                ]}
                onChange={(value) => updateMeta('arrow_position', value)}
            />
            <SelectControl
                label={__('Box Position', 'lapd-core')}
                value={meta.box_position}
                options={[
                    { label: 'Top Left', value: 'top left' },
                    { label: 'Top Right', value: 'top right' },
                    { label: 'Bottom Left', value: 'bottom left' },
                    { label: 'Bottom Right', value: 'bottom right' },
                ]}
                onChange={(value) => updateMeta('box_position', value)}
            />
        </PluginDocumentSettingPanel>
    );
};

registerPlugin('meta-fields-panel', {
    render: MetaFieldsPanel,
});

<?php
return array(
    'dependencies' => array(
        'wp-plugins',
        'wp-edit-post',
        'wp-element',
        'wp-components',
        'wp-data',
        'wp-i18n'
    ),
    'version' => '1.0.0'
);

<?php
/**
 * Plugin Name: Name Web Core
 * Description: Basic functionalities for the WordPress site, including the registration of Custom Post Types and taxonomies, and additional metadata.
 * Version: 1.0
 * Author: Flavia Bernárdez Rodríguez
 * Author URI: https://flabernardez.com
 * License: GPL v3 or later
 * Text Domain: nameweb-core
 * Domain Path: /languages
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly
}

/* aquí el código */

?>

Si estoy en un entorno online donde node está instalado en un sitio en concreto, al iniciar sesión en el entorno (como por ejemplo en nicalia) ejecutar este comando:

export PATH=/opt/alt/alt-nodejs22/root/bin:$PATH