npx create-next-app を使用して next.js 13 typescript アプリケーションを作成しました。サンプルの CSS と HTML をすべて削除し、MUI を導入してみました。私の app/layout.tsx は次のようになります:
CSSBaseline ビットを追加すると、React インポートに欠落しているものに関する大量のエラーが生成されます。これは、React がサーバー コンポーネントからアクセスされ、ルート レイアウト コンポーネントがそのサーバー コンポーネントである必要があるためです。これはエラー出力です:
これはやるべきではないでしょうか?私は何を取りこぼしたか？
これを完了したら、残りの作業が適切に行われ、MUI アプリを構築できるようになると思います。
material-next-ts のサンプルをページ ルーターからアプリケーション ルーターに移植することを検討しています。ただし、使用されている感情のバージョンは、セットアップを必要としない、より単純なデフォルトの方法をサポートしているため、この例でページ ルーティングがジャンプするフープはすべて不要であるように見えます。このサンプルが Application Router に移植されたら素晴らしいでしょう。
P粉1954022922023-12-24 09:29:50
エラー メッセージのガイダンスにより問題が解決されます:
リーリー'use client' ディレクティブを app/layout.tsx の先頭に追加してみてください。以下は、「クライアントを使用する」 が必要な理由に関する Next.js ドキュメント の説明です。
別の部分があります 説明 app/layout.tsx はデフォルトでサーバー コンポーネントです: