Allow resolving content paths relative to the config file

[thecrypticace]

Right now we resolve content paths relative the the current working directory ("CWD"). If you run the CLI from a different location than the current working directory you can get unexpected results.

As an example, let's say that your config says that your content files live under ./src/pages/**/*.js and ./src/components/**.js. If you run Tailwind CSS using npx tailwindcss build … from inside the src/ directory then Tailwind will complain about not being able to find any content paths. This doesn't make much sense because, to the user, the content is relative to the "project root" — which is almost always where their config file is.

So, we've added an option content.relative that lets you specify this behavior explicitly:

module.exports = {
  content: {
    relative: true,
    files: [
      "./src/pages/**/*.js",
      "./src/components/**/*.js",
    ],
  },
  // …
}

Note
Setting content.relative to true ensures that your non-absolute paths are resolved relative to the config file. You can also explicitly say that you don't want this behavior by setting it to false.

This will let you run Tailwind CSS from anywhere and it will resolve the file paths relative the location of the config file. If you do NOT use a config file (because you're passing an object, because you're using Nuxt with it's Tailwind CSS plugin, or some other third party solution) then the paths are resolved relative to the current working directory.

This is a change we intend to make the default behavior in the future for v4 — as such we've added a flag future.relativeContentPathsByDefault that enables this behavior by default. This allows you to keep using the array syntax for content paths instead of needing the object:

module.exports = {
  future: {
    relativeContentPathsByDefault: true,
  },
  content: [
    "./src/pages/**/*.js",
    "./src/components/**/*.js",
  ],
  // …
}

Fixes #6516