Example plugin demonstrating how to integrate Tailwind with the @wordpress/create-block script. The plugin was scaffolded using @wordpress/create-block and then Tailwind was manually integrated.
Coming soon! Work has started on a custom template for @wordpress/create-block that will create a full block plugin with multiple blocks, each one seamlessly integrated with Tailwind right out of the box.
Clone the repository and install npm packages.
git clone https://github.com/dgwyer/tailwind-blocks.git
cd tailwind-blocks
npm i
Start the build process in development or do a production build.
npm start or npm run build
Add the plugin to the /wp-content/plugins/ folder of your local WordPress site and activate as normal.
Create a new page and add any of the three example blocks included with the plugin to the editor.
Change the source code in any block. e.g. ./src/block1/edit.js and add Tailwind classes. If you're in development mode then the plugin will automatically recompile JS and CSS including Tailwind styles. Simply refresh the browser to view updates.