npx create-next-app を使用して next.js 13 typescript アプリケーションを作成しました。サンプルの CSS と HTML をすべて削除し、MUI を導入してみました。私の app/layout.tsx は次のようになります:

CSSBaseline ビットを追加すると、React インポートに欠落しているものに関する大量のエラーが生成されます。これは、React がサーバー コンポーネントからアクセスされ、ルート レイアウト コンポーネントがそのサーバー コンポーネントである必要があるためです。これはエラー出力です:

これはやるべきではないでしょうか?私は何を取りこぼしたか？

これを完了したら、残りの作業が適切に行われ、MUI アプリを構築できるようになると思います。

material-next-ts のサンプルをページ ルーターからアプリケーション ルーターに移植することを検討しています。ただし、使用されている感情のバージョンは、セットアップを必要としない、より単純なデフォルトの方法をサポートしているため、この例でページ ルーティングがジャンプするフープはすべて不要であるように見えます。このサンプルが Application Router に移植されたら素晴らしいでしょう。