GrapesJS TailwindCSS v4 Plugin

[fasenderos]

Hello everyone,
I’m happy to share a plugin I’ve created to integrate TailwindCSS v4 into GrapesJS! This plugin dynamically builds the Tailwind CSS on-the-fly and makes it available in the export.

Link: https://github.com/fasenderos/grapesjs-tailwindcss-plugin
Demo: https://codesandbox.io/p/sandbox/grapesjs-tailwindcss-4-plugin-demo-d24p68

Any feedback is greatly appreciated

[artf]

That's awesome @fasenderos 💜

My only suggestion would be around your setTailwindStyleElement. When you have to inject anything custom inside GrapesJS iframes, outside of its Component models, you can rely on canvas events, this will make your integration work with multiple pages/frames.

editor.on('canvas:frame:load:body', ({ window }) => {
 // ...
 // window of the iframe
 window.document.head.appendChild(...)
});