Remove AOT (#5340)

* make `jit` mode the default when no mode is specified

* unify JIT and AOT codepaths

* ensure `Object.entries` on undefined doesn't break

It could be that sometimes you don't have values in your config (e.g.: `presets: []`), this in turn will break some plugins where we assume we have a value.

* drop AOT specific tests

These tests are all covered by JIT mode already and were AOT specific.

* simplify tests, and add a few

Some of the tests were written for AOT specifically, some were missing. We also updated the way we write those tests, essentially making Tailwind a blackbox, by testing against the final output.
Now that JIT mode is the default, this is super fast because we only generate what is used, instead of partially testing in a 3MB file or building it all, then purging.

* add some todo's to make sure we warn in a few cases

* make `darkMode: 'media'`, the default

This also includes moving dark mode tests to its own dedicated file.

* remove PostCSS 7 compat mode

* update CLI to be JIT-first

* fix integration tests

This is not a _real_ fix, but it does solve the broken test for now.

* warn when using @responsive or @variants

* remove the JIT preview warning

* remove AOT-only code paths

* remove all `mode: 'jit'` blocks

Also remove `variants: {}` since they are not useful in `JIT` mode
anymore.

* drop unused dependencies

* rename `purge` to `content`

* remove static CDN builds

* mark `--purge` as deprecated in the CLI

This will still work, but a warning will be printed and it won't show up
in the `--help` output.

* cleanup nesting plugin

We don't have to duplicate it anymore since there is no PostCSS 7
version anymore.

* make sure integration tests run in band

* cleanup folder structure

* make sure nesting folder is available

* simplify resolving of purge/content information

src/util/createUtilityPlugin.js

@@ -36,7 +36,7 @@ export default function createUtilityPlugin(
         {
           values: filterDefault
             ? Object.fromEntries(
-                Object.entries(theme(themeKey) || {}).filter(([modifier]) => modifier !== 'DEFAULT')
+                Object.entries(theme(themeKey) ?? {}).filter(([modifier]) => modifier !== 'DEFAULT')
               )
             : theme(themeKey),
           variants: variants(themeKey),

src/util/flattenColorPalette.js

@@ -1,7 +1,7 @@
 const flattenColorPalette = (colors) =>
   Object.assign(
     {},
-    ...Object.entries(colors || {}).flatMap(([color, values]) =>
+    ...Object.entries(colors ?? {}).flatMap(([color, values]) =>
       typeof values == 'object'
         ? Object.entries(flattenColorPalette(values)).map(([number, hex]) => ({
             [color + (number === 'DEFAULT' ? '' : `-${number}`)]: hex,

src/util/resolveConfig.js

@@ -14,6 +14,7 @@ import corePluginList from '../corePluginList'
 import configurePlugins from './configurePlugins'
 import defaultConfig from '../../stubs/defaultConfig.stub'
 import colors from '../../colors'
+import log from './log'
 
 const configUtils = {
   colors,
@@ -257,30 +258,86 @@ function resolvePluginLists(pluginLists) {
 }
 
 export default function resolveConfig(configs) {
-  const allConfigs = [
+  let allConfigs = [
     ...extractPluginConfigs(configs),
     {
-      darkMode: false,
+      content: [],
       prefix: '',
       important: false,
       separator: ':',
       variantOrder: defaultConfig.variantOrder,
     },
   ]
-  const { variantOrder } = allConfigs.find((c) => c.variantOrder)
+  let { variantOrder } = allConfigs.find((c) => c.variantOrder)
 
-  return defaults(
-    {
-      theme: resolveFunctionKeys(
-        mergeExtensions(mergeThemes(map(allConfigs, (t) => get(t, 'theme', {}))))
-      ),
-      variants: resolveVariants(
-        allConfigs.map((c) => get(c, 'variants', {})),
-        variantOrder
-      ),
-      corePlugins: resolveCorePlugins(allConfigs.map((c) => c.corePlugins)),
-      plugins: resolvePluginLists(configs.map((c) => get(c, 'plugins', []))),
-    },
-    ...allConfigs
+  return normalizeConfig(
+    defaults(
+      {
+        theme: resolveFunctionKeys(
+          mergeExtensions(mergeThemes(map(allConfigs, (t) => get(t, 'theme', {}))))
+        ),
+        variants: resolveVariants(
+          allConfigs.map((c) => get(c, 'variants', {})),
+          variantOrder
+        ),
+        corePlugins: resolveCorePlugins(allConfigs.map((c) => c.corePlugins)),
+        plugins: resolvePluginLists(configs.map((c) => get(c, 'plugins', []))),
+      },
+      ...allConfigs
+    )
   )
 }
+
+let warnedAbout = new Set()
+function normalizeConfig(config) {
+  if (!warnedAbout.has('purge-deprecation') && config.hasOwnProperty('purge')) {
+    log.warn([
+      'The `purge` option in your tailwind.config.js file has been deprecated.',
+      'Please rename this to `content` instead.',
+    ])
+    warnedAbout.add('purge-deprecation')
+  }
+
+  config.content = {
+    content: (() => {
+      let { content, purge } = config
+
+      if (Array.isArray(content)) return content
+      if (Array.isArray(content?.content)) return content.content
+      if (Array.isArray(purge)) return purge
+      if (Array.isArray(purge?.content)) return purge.content
+
+      return []
+    })(),
+    safelist: (() => {
+      let { content, purge } = config
+
+      let [safelisKey, safelistPaths] = (() => {
+        if (Array.isArray(content?.safelist)) return ['content.safelist', content.safelist]
+        if (Array.isArray(purge?.safelist)) return ['purge.safelist', purge.safelist]
+        return [null, []]
+      })()
+
+      return safelistPaths.map((content) => {
+        if (typeof content === 'string') {
+          return { raw: content, extension: 'html' }
+        }
+
+        if (content instanceof RegExp) {
+          throw new Error(
+            `Values inside '${safelistKey}' can only be of type 'string', found 'regex'.`
+          )
+        }
+
+        throw new Error(
+          `Values inside '${safelisKey}' can only be of type 'string', found '${typeof content}'.`
+        )
+      })
+    })(),
+    extract: config.content?.extract || config.purge?.extract || {},
+    options: config.content?.options || config.purge?.options || {},
+    transform: config.content?.transform || config.purge?.transform || {},
+  }
+
+  return config
+}