purgecss
purgecss copied to clipboard
[Bug]: regex not recognized when using PostCSS json config (postcss.config.json)
Describe the bug
According to the following commit, Angular supports PostCSS configuration only via json config files:
https://github.com/angular/angular-cli/commit/7c522aa8742cd936bb0dfd30773d88f3ef92d488
I am trying to purge CSS code like Bootstrap's using the following config (postcss.config.json) and Angular cli gives an error at PurgeCSS.isSelectorSafelistedDeep
t.test is not a function
node_modules/purgecss/lib/purgecss.js:1:9639
To Reproduce
I have created an angular environment to describe the issue but the same goes for other frameworks in case the PostCSS config is JSON.
https://stackblitz.com/edit/angular-postcss-purgecss?file=src%2Fmain.ts
- Create a new angular app by running
ng new my-app
- Add Bootstrap as a dependency
- Create a new postcss.config.json with the content:
{
"plugins": {
"@fullhuman/postcss-purgecss": {
"content": [
"src/**/*.html"
],
"safelist": {
"standard": [
"primary$",
"^mt-\\d",
"btn$",
"invalid-feedback",
"fade",
"show",
"collapsing",
"anticon$"
],
"deep": [
"^form-\\w[a-z-]+",
"^modal-.*",
"^offcanvas-.*",
"^row-cols-.*",
"^btn-.*",
"^col-.*",
"^ant-.*",
"^nz-.*",
"^cdk-.*"
],
"greedy": [],
"keyframes": [],
"variables": []
},
"skippedContentGlobs": []
}
}
}
- Run
npm run build
Expected Behavior
JSON config to be parsed correctly so the regex patterns inside safelist.deep
and safelist.greedy
are taken into consideration without giving error.
Environment
Angular version 17.2 and above or another framework with postcss.config.json
Add any other context about the problem here
No response
Code of Conduct
- [X] I agree to follow this project's Code of Conduct