Ask A Question

Notifications

You’re not receiving notifications from this thread.

How add PurgeCss with TailwindCss?

Nikola Okonesh asked in CSS

https://next.tailwindcss.com/docs/controlling-file-size

postcss.config.js

const purgecss = require('@fullhuman/postcss-purgecss')({
  content: [
    './**/**/**/*.erb',
    './**/**/**/**/*.erb',
  ],
  extractors: [
    {
      extractor: class {
        static extract(content) {
          return content.match(/[A-Za-z0-9-_:/]+/g) || [];
        }
      },
      extensions: ['html']
    }
  ]
})

module.exports = {
  plugins: [
    require('tailwindcss'),
    require('autoprefixer'),
    require('postcss-import'),
    require('postcss-flexbugs-fixes'),
    require('postcss-preset-env')({
      autoprefixer: {
        flexbox: 'no-2009'
      },
      stage: 3
    }),
  ]
}

How to do right? Thanks

Reply

Hey Nikola,

I just posted an episode on this yesterday: https://gorails.com/episodes/purgecss

Reply
Join the discussion
Create an account Log in

Want to stay up-to-date with Ruby on Rails?

Join 76,990+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    Screencast tutorials to help you learn Ruby on Rails, Javascript, Hotwire, Turbo, Stimulus.js, PostgreSQL, MySQL, Ubuntu, and more. Icons by Icons8

    © 2023 GoRails, LLC. All rights reserved.