purgecss icon indicating copy to clipboard operation
purgecss copied to clipboard

[Bug]: Getting error TypeError: pattern is too long and application is crashing when using purgeCss.

Open vikaskrsharma opened this issue 4 months ago • 1 comments

Describe the bug

I am using server side rendering with react and using webpack & ChunkExtractor to build cssString and html on server side. To purge unused css when using the purgeCss with html as string and css as string, i am getting 'TypeError: pattern is too long' error and my application crashed. Here is how i am using purgeCss:

import { PurgeCSS } from 'purgecss';
const reactHtml = renderToString(jsx);
const purgeCSSResults = await new PurgeCSS().purge({
content: [reactHtml],
css: [cssString],
});
const purgedCssString = purgeCSSResults[0].css;

And i am supplying this purgedCssString to a template to extract the header along with all the styles in tag and footer.

To Reproduce

Supply a large html as string and css as string to purge();

Expected Behavior

It should give a cssString with all unused css removed.

Environment

node

Add any other context about the problem here

context

Code of Conduct

  • [X] I agree to follow this project's Code of Conduct

vikaskrsharma avatar Feb 18 '24 16:02 vikaskrsharma