Antonella Framework just made a move that probably wasn’t on most developers’ radar: native React integration. Version 1.9.3 adds a complete module for running React + Vite inside any WordPress plugin built with the framework—without leaving the terminal and without manually wiring up script enqueues.
And no, this isn’t just a cosmetic patch. The PR behind it adds more than 2,000 new lines to the antonella CLI script. Let’s break down what actually changed and, more importantly, why it matters.
The Problem This Solves
Adding React to a WordPress plugin has always involved more friction than it should. You have to choose a bundler, set up Webpack or Vite yourself, write your own wp_enqueue_script calls, deal with hot reload during development, and then manually switch everything over to a production build when it’s time to package the plugin.
None of those steps is particularly difficult on its own. The problem is that you end up repeating the same setup work for every project—and nobody wants to do that over and over again.
Antonella 1.9.3 turns all of that into a single command.
What Exactly Does It Include?
One-Command Installation
php antonella add reactThis command generates the entire React scaffolding: Vite configuration, the Core/React.php class, global helpers, an example controller, and a ready-to-use example component.
Install the Node dependencies, run npm run dev, and you have Hot Module Replacement running directly inside the WordPress admin.
An Inertia.js-Inspired API
This is probably the most interesting design decision. Instead of inventing its own system for passing data to React, Antonella follows the pattern popularized by Inertia.js.
You can render a React component directly from a PHP controller:
public static function dashboardPage() { echo React::render('Dashboard', [ 'title' => 'My Dashboard', 'stats' => [ 'posts' => wp_count_posts()->publish, 'users' => count_users()['total_users'], ], ]); }On the React side, the component receives that data as regular props:
export default function Dashboard({ title, stats }) { return ( <div> <h1>{title}</h1> <p>Posts: {stats.posts}</p> </div> ); }No API routes to configure, no manually built JSON payloads, and no AJAX layer for basic use cases.
The component is automatically discovered when you create the file inside resources/js/Pages/—no manual imports or registration required.
Shared and Deferred Props
If multiple components handled by the same controller need access to the same data—such as the current user, a nonce, or site-level information—the boot() method can share that data automatically:
public static function boot() { React::share([ 'user' => [ 'name' => wp_get_current_user()->display_name, ], 'nonce' => wp_create_nonce('my_action'), ]); }For data that is expensive to calculate and may not always be needed, Antonella also provides React::lazy(). The data is only generated when the component actually needs to render it.
Multi-Root Support and Plugin Namespacing
This is one of the details that makes the difference between an experiment and a production-ready tool.
Each React integration gets a unique 8-character app_key. That means multiple Antonella plugins using React can coexist in the same WordPress installation without conflicting with each other—no duplicated script handles and no DOM container collisions.
There’s also a MutationObserver that automatically detects and mounts React containers dynamically added to the DOM. This is particularly useful for WordPress admin screens that load content through AJAX.
Production Builds Without the Headache
During development, Antonella loads the Vite client and entry point directly from the Vite dev server.
In production, it reads the manifest.json generated by npm run build and enqueues the hashed chunks using WordPress’s native functions.
Switching between development and production only requires changing one line in Config/React.php:
'app_env' => 'production', // or 'develop'Clean Uninstallation
If a project eventually doesn’t need React, running php antonella remove react removes the entire React scaffolding: configuration files, helpers, the JavaScript directory, vite.config.js, node_modules, and the production build.
You’ll still need to clean up your controllers and entries in Config.php manually, though.
One Detail Worth Highlighting
This feature didn’t come from our internal roadmap. It arrived as an external contribution through a pull request.
That’s an important milestone for Antonella Framework because it’s the first strong sign that the project is starting to attract contributions from the broader community—not just developers using it internally at CH Consulting.
And ultimately, that’s one of the reasons we open-sourced it in the first place.
Technical Stack
| Technology | Version |
|---|---|
| React | ^19.2.4 |
| React DOM | ^19.2.4 |
| Vite | ^7.3.1 |
| @vitejs/plugin-react | ^5.1.3 |
Who Is This For?
If you build WordPress plugins with complex admin interfaces—stateful dashboards, dynamic forms, interactive widgets, or React-powered frontend experiences—this can save you from one of the most tedious parts of adding React to your stack: setting up the build pipeline and managing your assets.
If your plugin is simple and doesn’t really need interactive UI components, this probably isn’t for you. Stick with Blade or plain PHP.
How to Try It
composer global require cehojac/antonella-installer antonella new my-plugin cd my-plugin php antonella add react npm install npm run devThe full documentation is available at antonellaframework.com/documentacion, and the source code is available in the GitHub repository.