Next.js _app.tsx 和 _document.tsx 的区别?

3 min read

在 Next.js 中,_app.tsx 和 _document.tsx 都是特殊的文件,用于自定义 Next.js 应用程序的行为和样式。

_app.tsx 是一个组件,它是所有页面组件的父组件。当页面组件被加载时,它们都将包含在 _app.tsx 组件中。_app.tsx 允许开发人员在整个应用程序中共享组件状态和布局。开发人员可以在 _app.tsx 中定义全局样式,安装第三方库和设置全局上下文。

_document.tsx 是一个 HTML 文档的自定义文件。在 Next.js 中,每个页面都有自己的 HTML 文档,_document.tsx 中定义的标记将应用于所有页面。_document.tsx 可以用于添加自定义样式表和脚本标记,或为页面指定特定的语言和其他元数据。

总之,_app.tsx 和 _document.tsx 的主要区别在于它们的作用范围。_app.tsx 是全局的,_document.tsx 是局部的。 _app.tsx 来为所有页面统一设置样式和全局状态, _document.tsx 来为局部页面定制 HTML 排版。