有没有更好的方法将类放入 html 并在 next.js 中放入 body 标签？

Is there a better way to put classes into html and body tags in next.js?

我正在使用 Next.js 和 Tailwind，为了让一些元素正确显示，我需要将一些样式类放入 <html> 和 <body>。

我对我的 MyApp

做了这个

function MyApp({ Component, pageProps}: AppProps) {
  useEffect(() => {
    document.querySelector("html").classList.add("h-full");
    document.querySelector("body").classList.add("h-full");
    document.querySelector("#__next").classList.add("h-full");
  });

  return (
      <Component {...pageProps} />
  )
}

行得通...但我想知道是否还有其他方法或更优雅的解决方案。

我们两者都用，并用这个做了一个 _document.tsx 文件：

import { Html, Head, Main, NextScript } from 'next/document'

export default function Document() {
    return (
        <Html lang="en-us" className="h-full">
            <Head />
            <body className="h-full">
                <Main />
                <NextScript />
            </body>
        </Html>
    )
}

我们在一些 Tailwind CSS/Next.js 研究中发现了这个，它对我们有用。