Tailwindを既存のreactアプリに導入する方法

Question

前提

既存のreact + typescriptアプリにtailwindcssを導入したいです
公式サイトの手順に従いインストールをしましたがエラーが出てしまします

実際に行った手順

$npm install -D tailwindcss postcss autoprefixer
$npx tailwindcss init -p

/** @type {import('tailwindcss').Config} */ 
module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

参考：公式サイト

発生している問題・エラーメッセージ

SyntaxError: Unexpected token 'export'
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1085:15)
    at Module._compile (node:internal/modules/cjs/loader:1119:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1216:10)
    at Module.load (node:internal/modules/cjs/loader:1035:32)
    at Module._load (node:internal/modules/cjs/loader:876:12)
    at Function.c._load (node:electron/js2c/asar_bundle:5:13343)
    at Module.require (node:internal/modules/cjs/loader:1059:19)
    at Module.Vd._require.Gi.default.require (/Users/tomo/.vscode/extensions/bradlc.vscode-tailwindcss-0.8.6/dist/tailwindServer.js:179:63908)
    at require (node:internal/modules/cjs/helpers:102:18)

よろしくお願いします

追記

node.jsのバージョンが原因かもしれないという記事を見つけアップデートをし、現在v16.16.0ですが同じエラーが出ています

Answer 1

1)next-transpile-modules をダウンロードする npm i next-transpile-modulesまたはyarn add next-transpile-modules
2)次のように next.config.js を作成する

const withTM = require('next-transpile-modules')(["@material-tailwind/react"]); 

module.exports = withTM({...})

こちらで解決しますでしょうか？