vue.js - Autoprefixer を TailwindCSS および Gridsome と連携させる

Question

次の手順に従って、Gridsome で TailwindCSS を正常にセットアップしました: https://gridsome.org/docs/assets-css/#tailwind

ただし、これらの手順には、autoprefixer のセットアップ方法も記載されていません。そこで、次のように自分で試してみました。

• npm install autoprefixer
• ファイルを変更しましたgridsome.config.js（変更した内容のコメントを含む変更されたコードについては、以下を参照してください）
• ランgridsome develop
• ベンダー プレフィックスが追加されているかどうかを確認するflexために、 のクラスを追加しました。p

結果...

何もない。接頭辞なし ( のみdisplay: flex;)。

これを機能させる方法はありますか？

ありがとう

変更された gridsome.config.jsファイル:

const autoprefixer = require("autoprefixer");  // ADDED THIS LINE
const tailwind = require("tailwindcss");
const purgecss = require("@fullhuman/postcss-purgecss");

const postcssPlugins = [tailwind(), autoprefixer()]; // ADDED `autoprefixer()` to postcssPlugins array

if (process.env.NODE_ENV === "production") postcssPlugins.push(purgecss());

module.exports = {
  siteName: "Gridsome",
  plugins: [],
  css: {
    loaderOptions: {
      postcss: {
        plugins: postcssPlugins
      }
    }
  }
};