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

tests/postcss-plugins/nesting/index.test.js

@@ -0,0 +1,176 @@
+let postcss = require('postcss')
+let postcssNested = require('postcss-nested')
+let plugin = require('../../../nesting')
+
+it('should be possible to load a custom nesting plugin', async () => {
+  let input = css`
+    .foo {
+      color: black;
+      @screen md {
+        color: blue;
+      }
+    }
+  `
+
+  expect(
+    await run(input, function (root) {
+      root.walkRules((rule) => {
+        rule.selector += '-modified'
+      })
+    })
+  ).toMatchCss(css`
+    .foo-modified {
+      color: black;
+      @media screen(md) {
+        color: blue;
+      }
+    }
+  `)
+})
+
+it('should be possible to load a custom nesting plugin by name (string) instead', async () => {
+  let input = css`
+    .foo {
+      color: black;
+      @screen md {
+        color: blue;
+      }
+    }
+  `
+
+  expect(await run(input, 'postcss-nested')).toMatchCss(css`
+    .foo {
+      color: black;
+    }
+
+    @media screen(md) {
+      .foo {
+        color: blue;
+      }
+    }
+  `)
+})
+
+it('should default to the bundled postcss-nested plugin (no options)', async () => {
+  let input = css`
+    .foo {
+      color: black;
+      @screen md {
+        color: blue;
+      }
+    }
+  `
+
+  expect(await run(input)).toMatchCss(css`
+    .foo {
+      color: black;
+    }
+
+    @media screen(md) {
+      .foo {
+        color: blue;
+      }
+    }
+  `)
+})
+
+it('should default to the bundled postcss-nested plugin (empty ooptions)', async () => {
+  let input = css`
+    .foo {
+      color: black;
+      @screen md {
+        color: blue;
+      }
+    }
+  `
+
+  expect(await run(input, {})).toMatchCss(css`
+    .foo {
+      color: black;
+    }
+
+    @media screen(md) {
+      .foo {
+        color: blue;
+      }
+    }
+  `)
+})
+
+test('@screen rules are replaced with media queries', async () => {
+  let input = css`
+    .foo {
+      color: black;
+      @screen md {
+        color: blue;
+      }
+    }
+  `
+
+  expect(await run(input, postcssNested)).toMatchCss(css`
+    .foo {
+      color: black;
+    }
+
+    @media screen(md) {
+      .foo {
+        color: blue;
+      }
+    }
+  `)
+})
+
+test('@screen rules can work with `@apply`', async () => {
+  let input = css`
+    .foo {
+      @apply bg-black;
+      @screen md {
+        @apply bg-blue-500;
+      }
+    }
+  `
+
+  expect(await run(input, postcssNested)).toMatchCss(css`
+    .foo {
+      @apply bg-black;
+    }
+
+    @media screen(md) {
+      .foo {
+        @apply bg-blue-500;
+      }
+    }
+  `)
+})
+
+// ---
+
+function indentRecursive(node, indent = 0) {
+  node.each &&
+    node.each((child, i) => {
+      if (!child.raws.before || child.raws.before.includes('\n')) {
+        child.raws.before = `\n${node.type !== 'rule' && i > 0 ? '\n' : ''}${'  '.repeat(indent)}`
+      }
+      child.raws.after = `\n${'  '.repeat(indent)}`
+      indentRecursive(child, indent + 1)
+    })
+}
+
+function formatNodes(root) {
+  indentRecursive(root)
+  if (root.first) {
+    root.first.raws.before = ''
+  }
+}
+
+async function run(input, options) {
+  return (
+    await postcss([options === undefined ? plugin : plugin(options), formatNodes]).process(input, {
+      from: undefined,
+    })
+  ).toString()
+}
+
+function css(templates) {
+  return templates.join('')
+}