Questions tagged [css-purge]

A CSS tool written in Node JS as a command line app or library for the purging, burning, reducing, shortening, compressing, cleaning, trimming and formatting of duplicate, extra, excess or bloated CSS.

More information here: https://www.npmjs.com/package/css-purge

90 questions
1
vote
1 answer

How to configure PurgeCSS for vue-cli-3 projects with TailwindCSS? (including responsive classes)

I'm trying to deploy a vue-cli-3 project. I used TailwindCSS and created a vue.config.js file and it's working, but responsive classes are not being included. I searched about a regex, using a extractor in a webpack.config.js file but it didn't…
lelukas
  • 53
  • 2
  • 11
1
vote
1 answer

Special characters and PurgeCSS not working as expected

Using PurgeCSS along with Laravel Mix on a non Laravel project. Everything works well but I want to use some special non CSS characters in my responsive utility classes but PurgeCSS is stripping them even if present in the markup. My example class…
Lovelock
  • 7,689
  • 19
  • 86
  • 186
0
votes
1 answer

gatsby purge css plugin not installing

To merge the css in my gatsby project I was trying to install a plugin called purge css but while installing it gives the error and stops `evo02@evo02:/var/www/html/Evolvan (staging fresh without edits)/evolvan.com-gatsby$ npm install…
0
votes
0 answers

Tailwindcss V3 PurgeCSS config in NextJs

I am having a problem configuring Tailwindcss in NextJs. (Versions if helpful: Tailwindcss -> V3.2.7 and NextJs -> 13.1.16) Here is My postcss.config.js file: const purgecss = [ "@fullhuman/postcss-purgecss", { // Specify the paths to all of the…
Ali Baghban
  • 517
  • 1
  • 5
  • 13
0
votes
0 answers

How can we optimise css in a NextJS - Material UI app?

The google core web vitals complain about not having the CSS optimised. Two main points - Reduce unused CSS (recommendation for both mobile and desktop) Minify CSS (recommendation for mobile devices) I tried optimising the fonts with @font-face…
0
votes
0 answers

Safelist pattern for bem modifiers tailwind

Is there a tailwind pattern that can include any modifiers written like this? component--modifier? The modifier is dynamically concatenated. So with twig logic it looks like this {{ modifier ? 'block--' ~ modifier }}. Which is why it isn't being…
Dan Emery
  • 1
  • 1
0
votes
0 answers

Css distorts for a couple of seconds before rendering properly,in angular application post using purgecss

I have used purgecss cli command in my angular(version-13.2.2) application in post build phase. And after deploying the change to AWS server, the landing page shows distortion for a couple of seconds, before rendering the UI properly. This issue…
0
votes
0 answers

PurgeCss remove necessary css with .ejs files

I'm using in my project bootstrap and webpack. I'm importing bootstrap library from source files, in this way I'm able to import only css and js component I need. However I want more advanced optimization for my css and I'm using purgecss too.…
Nick
  • 1,439
  • 2
  • 15
  • 28
0
votes
0 answers

Why do I have to restart server on every style change?

I'm working on a NextJS application with PurgeCSS. I have to restart the server every single time I change the classname of a component. Here are my postcss.config.js: plugins: [ [ '@fullhuman/postcss-purgecss', { content:…
Gergő Horváth
  • 3,195
  • 4
  • 28
  • 64
0
votes
1 answer

Why need to specify paths or content in purgecss options?

I looking into Purgecss webpack docs and I'm a bit confused. Why do I need to specify paths in the plugin options? new PurgeCSSPlugin({ paths: glob.sync(`${PATHS.src}/**/*`, { nodir: true }), }), Or in postcss: purgecss({ …
Jon Sud
  • 10,211
  • 17
  • 76
  • 174
0
votes
1 answer

How to dynamically disable PurgeCSS?

I'm using PurgeCSS alongside Vite and I would like to disable PurgeCSS for some stylesheets. It is possible thanks to comments /* purgecss ignore */but I'm importing some CSS from libs directly in chunked & lazy loaded JS files like…
Kevin
  • 65
  • 5
0
votes
0 answers

Using tailwind purge option to remove unused css, but all styles are getting removed

Using tailwind purge option to remove unused css, but all styles are getting removed. Reference: https://v2.tailwindcss.com/docs/optimizing-for-production#basic-usage My tailwind.config.js file looks like below module.exports = { purge:…
user19591544
0
votes
0 answers

Whitelist pages to skip purgecss on tailwind next.js

I have Next.js project that use Tailwind CSS, and I want to make a UI Documentation by iterating over the config from tailwind.config.js. The problem is, it works on development, but when i try to build on production mode, the classes that i iterate…
0
votes
0 answers

Laravel Tailwind Purge PostProcessor - Include classes in PHP file

I am using a form builder package which keeps the classes in the PHP files (see below one example). However purge is removing these css classes thus they are not applying. Trying to work if you can can regex a php file as the data is all as…
Matt The Ninja
  • 2,641
  • 4
  • 28
  • 58
0
votes
2 answers

TailwindUI difference in npm run prod & dev

When I run npm run dev it shows the correct output of my TailwindUI component: But when I run npm run prod it doesn't recognize all the colors anymore. What is wrong? This is the config of my tailwind.config.js: const defaultTheme =…
user1469734
  • 851
  • 14
  • 50
  • 81