Nuxt 2(1でも？未確認)では yarn add postcss-loader すると何も設定しなくても style ブロックでpostcssを使うことができます。しかしながら、vscodeでVueのシンタックスハイライトをしてくれるVeturはそこまで考慮してシンタックスハイライトしてくれないのでpostcssのコードにエラーが出てしまいます。もちろん、nuxtは適切にコードを解釈できるのでvscode上のエラーさえ気にしなければ開発はできます。

(↓nuxtはエラーを出さないがvscode上ではエラーが表示される例)

逆にstyleブロックにlang="postcss"と指定してしまうとvscode上では適切な表示を得ることができますが、nuxtがwebpackに登録したローダーでは検知できなくなってしまうのでnuxtがエラーを吐きます。

そこで一つの解決策としてlang="postcss"と指定したときに使用されるローダーを追加してしまうという手が考えられます。以下のようにnuxt.conifg.jsを編集することでlang="css"と指定したときと同じ出力結果をlang="postcss"でも得ることができます。

nuxt.config.js


module.exports = {
...
  build: {
    extend(config, ctx) {
      for (let rule of config.module.rules) {
        if (rule.test.test('.css')) {
          config.module.rules.push({
            test: /\.postcss/,
            oneOf: rule.oneOf
          });
        }
      }

      return config;
    }
  },
}

この手法は一時しのぎにすぎず、本来であればVeturとnuxtが連携してcssに適用されるローダーを検知するようになっているべきです。ですのでそう遠くないうちにこんなことをしなくてもよくなるかもしれません。