React Js & Wordpress Plugin Package

Start WordPress Plugin Development with React JS Package in just few steps

Getting Started with this Setup

• Clone the repository inside of your wp-content/plugins directory
• Rename the cloned plugin directory, wp-vue-plugin.php
• Navigate to the plugin directory and run
  npm install
npm start
• Activate plugin

Create Your Own Setup

Step 1: Composer Setup

Step 2: NPM Setup - wp script

Step 3: Install @wordpress/scripts

Step 4: Add this code to Package json file

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "wp-scripts build",     
    "start": "wp-scripts start"
  }, 

Step 5: Create New File webpack.config.js

  const defaults = require('@wordpress/scripts/config/webpack.config');

   module.exports = {
     ...defaults,
     externals: {
       react: 'React',
       'react-dom': 'ReactDOM',
     },
   }; 

Step 6: Add code main php file

Step 7: Add React index file

 import { render } from '@wordpress/element';

 const App = () => {
     return (
         

             
React Wordpress App
             

         
      );
 }

 render(, document.getElementById('app'));