Nuxt.js^2.14.12でPostCSS プラグインを追加する際にエラーが出た時の解決方法

Nuxt.js^2.14.12に postcss-nestedを追加したかったので、公式に則って設定をするとビルド時にエラーが出ます。


How to add PostCSS plugins? - NuxtJS


まず、プラグインの追加。

yarn add postcss-nested --dev

nuxt.config.jsに追加したのはこちら。

build: {
  postcss: {
    plugins: {
      'postcss-nested': {}
    }
  }
}

エラー内容
Error: PostCSS plugin postcss-nested requires PostCSS 8.

Nuxt.js^2.14.12にはPostCSS 7が使われているみたいなので、postcss-nestedのバージョンをPostCSS8対応する前のバージョンを指定してエラーが出ずビルドが完了した。

yarn add postcss-nested@4.2.3 --dev