Question 30594 in Wordpress Question posted in
The official Wordpress documentation can be found here.

How can I keep/retain CSS comments in the Tailwind CSS build output? – WordPress

I’m writing a theme for WordPress, which requires comments in the CSS file as follows:

/*
Theme Name: XX
Theme URI: http://wordpress.org/themes/xxtheme
Author: X team
Author URI: http://xx.org/
Description: X theme.
Version: 1.1
Text Domain: Xdomain
*/

Whenever I compile Tailwind CSS, the whole contents of style.css gets replaced. Is there an easy way to a retain part of the CSS file?
I’m using the following command to build:

npx tailwindcss -i css/tailwind.css -o style.css
Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    Here's the solution that worked for me:

    I used the PostCSS method as mentioned in the Tailwind CSS documentation and then added comments at the top of the main.css (which is the CSS folder) file. So when I compile (using

    npm run dev

    ) the CSS the comments get copied to the output file. The package.json "scripts" tag is as follows:

    "scripts": { "dev": "postcss css/main.css -o style.css" }


  2. 0

    You could try safelisting the comments using https://purgecss.com/safelisting.html.

    I presume you are using purgecss as part of the build, but you haven’t pasted the Tailwind CSS or Webpack configuration.

    Login or Signup to reply.
  3. 0

    Add ! after the /* as shown in https://github.com/gregsullivan/_tw/blob/master/tailwind/custom/file-header.css

    So the full solution will look like this.

    /*!
Theme Name: XX
Theme URI: http://wordpress.org/themes/xxtheme
Author: X team
Author URI: http://xx.org/
Description: X theme.
Version: 1.1
Text Domain: Xdomain
*/

    Thanks

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search