Inconsistency between blog post and documentation for PostCSS

[outslept]

There's an inconsistency between the Tailwind CSS v4 announcement blog post and the official documentation regarding the PostCSS plugin configuration.

In the blog post (https://tailwindcss.com/blog/tailwindcss-v4), the configuration is shown as:

export default {
  plugins: ["@tailwindcss/postcss"],
};

https://tailwindcss.com/docs/installation/using-postcss

export default {
  plugins: {
    "@tailwindcss/postcss": {},
  }
}

With the first configuration I got an error (coming from a Vitest VS Code plugin):

Failed to load PostCSS config: TypeError: Invalid PostCSS Plugin found at: plugins[0]

I'm not sure if this is the right place to report this inconsistency, so I apologize if I'm posting in the wrong location.

Could someone please clarify which configuration format is correct? The array format from the blog work fine in the browser, but causes errors with testing tools like Vitest, while the object format from the documentation works fine and causes no errors.

Is there a technical difference between these two formats, or is one preferred over the other for compatibility reasons?

[wongjn]

It depends on how your build system loads PostCSS configuration. For example, Webpack's PostCSS integration accepts the array string format, whereas build tools using postcss-load-config (like Vite) use the object syntax.

[outslept]

Thank you!