Postcss config has deprecated syntax

[Alexufo]

Describe the bug

https://vitejs.dev/guide/features.html#postcss

vite support postcss.config.js with outdated syntax

  plugins: {
    // Plugins for PostCSS
    "postcss-short": { prefix: "x" },
    "postcss-preset-env": {},
  },

New syntax

    plugins: [
      // Plugins for PostCSS
      ["postcss-short", { prefix: "x" }],
      "postcss-preset-env",
    ],

from here https://webpack.js.org/loaders/postcss-loader/

proof postcss/postcss-load-config#224

Reproduction

new syntax not support in Vite

    plugins: [
      // Plugins for PostCSS
      ["postcss-short", { prefix: "x" }],
      "postcss-preset-env",
    ],

System Info

win10, vite 2.6.0

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[bluwy]

@Alexufo I'm confused about what to take action here. Are there code/documentation to update?

new syntax not support in Vite

In what way Vite isn't supporting it? Vite uses postcss-load-config to load the postcss config.

[bluwy]

If the object format is outdated, it should be logged by postcss-load-config instead. Currently it's still supported there, which normalizes the output into an array of plugins for Vite to use, so it would be hard to know if the syntax is outdated either. Closing as there hasn't been any response too.