Register PurgeCSS content as PostCSS dependencies (#4543)

* add `glob` property to `dir-dependency` messages * Add `glob` to `dir-dependency` messages * register purge content as postcss dependencies
tailwindlabs · Jun 3, 2021 · a3db3a4 · a3db3a4
1 parent 1e48728
commit a3db3a4
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 15 deletions.
diff --git a/src/lib/purgeUnusedStyles.js b/src/lib/purgeUnusedStyles.js
@@ -4,6 +4,8 @@ import purgecss from '@fullhuman/postcss-purgecss'
 import log from '../util/log'
 import htmlTags from 'html-tags'
 import path from 'path'
+import parseDependency from '../util/parseDependency'
+import normalizePath from 'normalize-path'
 
 function removeTailwindMarkers(css) {
   css.walkAtRules('tailwind', (rule) => rule.remove())
@@ -46,7 +48,12 @@ function getTransformer(config, fileExtension) {
   return transformers[fileExtension] || transformers.DEFAULT || ((content) => content)
 }
 
-export default function purgeUnusedUtilities(config, configChanged, resolvedConfigPath) {
+export default function purgeUnusedUtilities(
+  config,
+  configChanged,
+  resolvedConfigPath,
+  registerDependency
+) {
   const purgeEnabled = _.get(
     config,
     'purge.enabled',
@@ -115,6 +122,21 @@ export default function purgeUnusedUtilities(config, configChanged, resolvedConf
     }
   })
 
+  let content = (
+    Array.isArray(config.purge) ? config.purge : config.purge.content || purgeOptions.content || []
+  ).map((item) => {
+    if (typeof item === 'string') {
+      return normalizePath(
+        path.resolve(resolvedConfigPath ? path.dirname(resolvedConfigPath) : process.cwd(), item)
+      )
+    }
+    return item
+  })
+
+  for (let fileOrGlob of content.filter((item) => typeof item === 'string')) {
+    registerDependency(parseDependency(fileOrGlob))
+  }
+
   return postcss([
     function (css) {
       const mode = _.get(config, 'purge.mode', 'layers')
@@ -166,18 +188,7 @@ export default function purgeUnusedUtilities(config, configChanged, resolvedConf
       },
       extractors: fileSpecificExtractors,
       ...purgeOptions,
-      content: (Array.isArray(config.purge)
-        ? config.purge
-        : config.purge.content || purgeOptions.content || []
-      ).map((item) => {
-        if (typeof item === 'string') {
-          return path.resolve(
-            resolvedConfigPath ? path.dirname(resolvedConfigPath) : process.cwd(),
-            item
-          )
-        }
-        return item
-      }),
+      content,
     }),
   ])
 }
diff --git a/src/processTailwindFeatures.js b/src/processTailwindFeatures.js
@@ -25,7 +25,7 @@ let processedPlugins = null
 let getProcessedPlugins = null
 
 export default function (getConfig, resolvedConfigPath) {
-  return function (css) {
+  return function (css, result) {
     const config = getConfig()
     const configChanged = hash(previousConfig) !== hash(config)
     previousConfig = config
@@ -56,6 +56,14 @@ export default function (getConfig, resolvedConfigPath) {
       }
     }
 
+    function registerDependency(dependency) {
+      result.messages.push({
+        plugin: 'tailwindcss',
+        parent: result.opts.from,
+        ...dependency,
+      })
+    }
+
     return postcss([
       substituteTailwindAtRules(config, getProcessedPlugins()),
       evaluateTailwindFunctions({ tailwindConfig: config }),
@@ -65,7 +73,7 @@ export default function (getConfig, resolvedConfigPath) {
       substituteScreenAtRules({ tailwindConfig: config }),
       substituteClassApplyAtRules(config, getProcessedPlugins, configChanged),
       applyImportantConfiguration(config),
-      purgeUnusedStyles(config, configChanged, resolvedConfigPath),
+      purgeUnusedStyles(config, configChanged, resolvedConfigPath, registerDependency),
     ]).process(css, { from: _.get(css, 'source.input.file') })
   }
 }