PurgeCSS skippedContentGlobs not working

What version of Tailwind CSS are you using?

2.2.15

What build tool (or framework if it abstracts the build tool) are you using?

tailwindcss

What version of Node.js are you using?

v14.17.2

What browser are you using?

Firefox

What operating system are you using?

macOS

Reproduction repository

https://github.com/MatsKruger/tailwind-purge

Describe your issue

I have this situation where i need to exclude some folders from the build process. Earlier it would be possible with eg. !(node_modules) but it looks like that node-glob which PurgeCSS relies on, have removed this features. Instead in PurgeCSS as of 4.0.3 it is possible to use skippedContentGlobs option to define globs which should be excluded. https://github.com/FullHuman/purgecss/commit/2a276635ab598bd751a139a218f295d9923ec44b.

I have tried adding the options object to tailwind.config.js as described here https://tailwindcss.com/docs/optimizing-for-production#purge-css-options. But it is not working.

In the reproduction repository i have made 2 scripts in package.json “build” and “purge”.

Build makes a tailwind css file in the dist folder Purge purges the tailwind css file in the dist folder.

I added the same skippedContentGlobs to purgecss.config.js.

I also included the dist folder in the repository so it would be possible to see the output without building first.

The “purge” script does not work when run after “build”. That is because when using “build” the css output is invalid. It adds the below. So you would have to remove that before being able to use “purge”

.w-\[this-is\\\\\]w-\\\\\[weird-but-valid\] {
  width: this-is\\]w-\\[weird-but-valid;
}

I really hope you can help with this issue. Normally i would put everything inside a folder but in the project i am facing the issue everything is at the root level.

[RobinMalfait]

Hey! Thank you for your bug report! Much appreciated! 🙏

jit mode doesn’t use PurgeCSS anymore so some of the features are not available. We kept the name purge for backwards compatibility reasons.

Looking at your repo, instead of defining your content as:

content: [
  './**/*.php',
  './**/*.js',
],

I would define it more explicit so that you don’t need the skippedContentGlobs at all. For example, you could put everything in a src folder:

content: [
  './src/**/*.{php,js}',
],

[vchirikov]

Faced with the same issue 😦 Sad that we don’t have ignore globs