Title: Opinion about tailwindcss compile by javascript
Last modified: October 28, 2022

---

# Opinion about tailwindcss compile by javascript

 *  Resolved [won5572](https://wordpress.org/support/users/won5572/)
 * (@won5572)
 * [3 years, 7 months ago](https://wordpress.org/support/topic/opinion-about-tailwindcss-compile-by-javascript/)
 * I saw the windicss. Windi CSS is fully compatible with Tailwind CSS v2.
    I read
   about the compile page. ([https://windicss.org/integrations/javascript.html](https://windicss.org/integrations/javascript.html))
   I think it’s able to generate the css from db content. Generate css >> upload
   by ajax-post >> import css file uploaed
 *     ```
       const { Processor } = require("windicss/lib");
       const { HTMLParser } = require("windicss/utils/parser");
   
       export function generateStyles(html) {
         // Get windi processor
         const processor = new Processor();
   
         // Parse HTML to get array of class matches with location
         const parser = new HTMLParser(html);
   
         // Generate preflight based on the HTML we input
         const preflightSheet = processor.preflight(html, false);
   
         console.log(preflightSheet);
   
         const PREFIX = "";
         const outputCSS = [];
         let outputHTML = "";
         let indexStart = 0;
   
         parser.parseClasses().forEach((p) => {
           // add HTML substring from index to match start
           outputHTML += html.substring(indexStart, p.start);
   
           // generate stylesheet
           const style = processor.compile(p.result, PREFIX);
   
           // add the styleSheet to the styles stack
           outputCSS.push(style.styleSheet);
   
           // append ignored classes and push to output
           outputHTML += [style.className, ...style.ignored].join(" ");
   
           // mark the end as our new start for next iteration
           indexStart = p.end;
         });
   
         // append the remainder of html
         outputHTML += html.substring(indexStart);
   
         // Build styles
         const MINIFY = false;
         const styles = outputCSS
           // extend the preflight sheet with each sheet from the stack
           .reduce((acc, curr) => acc.extend(curr), preflightSheet)
           .build(MINIFY);
   
         return {
           styles,
           outputHTML
         };
       }
   
       const test111 = generateStyles("<div class='p-3'>test</div>");
       console.log(test111);
       ```
   

Viewing 2 replies - 1 through 2 (of 2 total)

 *  Plugin Author [Greg](https://wordpress.org/support/users/freshbrewedweb/)
 * (@freshbrewedweb)
 * [3 years, 5 months ago](https://wordpress.org/support/topic/opinion-about-tailwindcss-compile-by-javascript/#post-16309796)
 * Hi [@won5572](https://wordpress.org/support/users/won5572/) thanks for that suggestion!
   In the latest version 0.3 I moved to a server side generation of CSS instead 
   of the client side since it was causing several issues that were hard to control
   including a potential security vulnerability (CSS injection).
 * In the case of Windi CSS and your suggestion, unfortunately that would require
   a NodeJS runtime which we don’t have in WordPress. Instead I made [my own server side Tailwind API here](https://tailwind.restedapi.com/).
   Feel free to use for your cases directly too, it’s completely free.
 *  Plugin Author [Greg](https://wordpress.org/support/users/freshbrewedweb/)
 * (@freshbrewedweb)
 * [3 years, 5 months ago](https://wordpress.org/support/topic/opinion-about-tailwindcss-compile-by-javascript/#post-16310114)
 * Marking resolved

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Opinion about tailwindcss compile by javascript’ is closed to new replies.

 * ![](https://ps.w.org/tailpress/assets/icon-256x256.png?rev=2836881)
 * [TailPress – Tailwind for WordPress](https://wordpress.org/plugins/tailpress/)
 * [Support Threads](https://wordpress.org/support/plugin/tailpress/)
 * [Active Topics](https://wordpress.org/support/plugin/tailpress/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/tailpress/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/tailpress/reviews/)

 * 3 replies
 * 2 participants
 * Last reply from: [Greg](https://wordpress.org/support/users/freshbrewedweb/)
 * Last activity: [3 years, 5 months ago](https://wordpress.org/support/topic/opinion-about-tailwindcss-compile-by-javascript/#post-16310114)
 * Status: resolved