如何将 MUI _document.js 和 _app.js 迁移到 next.js13 app/layout.js

我找到了这些文档（_document.js，_app.js），但我不太清楚应该如何定义它。

这是我开始构建的layout.js 文件，是否缺少某些内容或需要修复某些内容？

谢谢。

app/layout.js

import React from 'react'
import PropTypes from 'prop-types'
import { ThemeProvider } from '@mui/material/styles'
import CssBaseline from '@mui/material/CssBaseline'
import { CacheProvider } from '@emotion/react'
import theme, { roboto } from '../utility/theme'
import Head from './Head'
import createEmotionCache from '../utility/createEmotionCache'

const clientSideEmotionCache = createEmotionCache()

export default function RootLayout({ children }, props) {
  const { Component, cache = clientSideEmotionCache, pageProps } = props

  return (
    <html className={roboto.className}>
      <CacheProvider value={cache}>
        <Head />
        <body>
          <ThemeProvider theme={theme}>
            <CssBaseline />
            <Component {...pageProps}>{children}</Component>
          </ThemeProvider>
        </body>
      </CacheProvider>
    </html>
  )
}

RootLayout.propTypes = {
  Component: PropTypes.elementType.isRequired,
  emotionCache: PropTypes.object,
  pageProps: PropTypes.object.isRequired,
}

Run Code Online (Sandbox Code Playgroud)

归档时间：	3 年，1 月前
查看次数：	652 次
最近记录：	3 年，1 月前