Inconsistency in settings plugins to postcss-loader and inside nuxt.config.js for NuxtJS since PostCSS8 is released

[Kohki Shiga]

Modification Proposal

Hi,
I think there is an inconsistency in setting plugins to postcss-loader for NuxtJS.
In the documentation for postcss-loader, it recommends users to set the PostCSS plugins in an array format. You say that it is deprecated to set them as objects and won't be included in the next major release. (which I believe has already happened.)

However, if you look at the NuxtJS documentation, you'll see that the NuxtJS community recommends to configure postcss plugins in an object format.

As you can see, there is a huge contrast in the way you set the plugins. I think this way of configuration needs to be consistent.

Expected Behavior / Situation

I think the postcss-loader needs to be able to set plugins in object format as well so that it works with NuxtJS as well.

This is how NuxtJS recommends configuration for postcss.

export default {
build: {
postcss: {
// Add plugin names as key and arguments as value
// Install them before as dependencies with npm or yarn
plugins: {
// Disable a plugin by passing false as value
'postcss-url': false,
'postcss-nested': {},
'postcss-responsive-type': {},
'postcss-hexrgba': {}
},
preset: {
// Change the postcss-preset-env settings
autoprefixer: {
grid: true
}
}
}
}
}

Actual Behavior / Situation

The current postcss-loader recommends configuration only in array format.

Please paste the results of npx webpack info here, and mention other relevant information

[Alexander Akait]

You can use the same plugin multiple times with different options (other tools, like babel, used array too for plugins/presets), so array is good solution here, please open an issue in NuxtJS

[Kohki Shiga]

@alexander-akait
Yes, that makes sense. Thanks for your reply.

For those who have the same question, I've continued my discussion here with the nuxt community.