wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Make purge still preserve HTML elements for user-defined extractors (#2704)

Browse source 
* Add failing test for purge preserving element selectors when `defaultExtractor` is overridden

* `preserveHtmlElements` works with user-defined purge extractors
This commit is contained in:
Navith 2020-10-31 10:02:40 -04:00 • committed by GitHub
parent c606d2be23
commit d4bd2d0b05
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 74 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

31
src/lib/purgeUnusedStyles.js
View file

@ -22,6 +22,17 @@ function removeTailwindMarkers(css) {
})
}
export function tailwindExtractor(content) {
// Capture as liberally as possible, including things like `h-(screen-1.5)`
const broadMatches = content.match(/[^<>"'`\s]*[^<>"'`\s:]/g) || []
const broadMatchesWithoutTrailingSlash = broadMatches.map((match) => _.trimEnd(match, '\\'))
// Capture classes within other delimiters like .block(class="w-1/2") in Pug
const innerMatches = content.match(/[^<>"'`\s.(){}[\]#=%]*[^<>"'`\s.(){}[\]#=%:]/g) || []
return broadMatches.concat(broadMatchesWithoutTrailingSlash).concat(innerMatches)
}
export default function purgeUnusedUtilities(config, configChanged) {
const purgeEnabled = _.get(
config,
@ -46,6 +57,8 @@ export default function purgeUnusedUtilities(config, configChanged) {
return removeTailwindMarkers
}
const { defaultExtractor, ...purgeOptions } = config.purge.options || {}
return postcss([
function (css) {
const mode = _.get(config, 'purge.mode', 'layers')
@ -93,22 +106,16 @@ export default function purgeUnusedUtilities(config, configChanged) {
purgecss({
content: Array.isArray(config.purge) ? config.purge : config.purge.content,
defaultExtractor: (content) => {
// Capture as liberally as possible, including things like `h-(screen-1.5)`
const broadMatches = content.match(/[^<>"'`\s]*[^<>"'`\s:]/g) || []
const broadMatchesWithoutTrailingSlash = broadMatches.map((match) => _.trimEnd(match, '\\'))
// Capture classes within other delimiters like .block(class="w-1/2") in Pug
const innerMatches = content.match(/[^<>"'`\s.(){}[\]#=%]*[^<>"'`\s.(){}[\]#=%:]/g) || []
const matches = broadMatches.concat(broadMatchesWithoutTrailingSlash).concat(innerMatches)
const extractor = defaultExtractor || tailwindExtractor
const preserved = [...extractor(content)]
if (_.get(config, 'purge.preserveHtmlElements', true)) {
return [...htmlTags].concat(matches)
} else {
return matches
preserved.push(...htmlTags)
}
return preserved
},
...config.purge.options,
...purgeOptions,
}),
])
}