由于`pages/_app`中的`getInitialProps'，您已选择退出自动静态优化

Question

我正在构建下一个js应用程序。在我的项目中，我收到了警告。有人能帮我摆脱那种警告吗。请帮帮我。

你好，我正在使用这样的自定义应用程序-

import { ColorScheme, ColorSchemeProvider, Global, MantineProvider } from '@mantine/core'
import { getCookie, setCookie } from 'cookies-next'
import { GetServerSidePropsContext } from 'next'
import { ThemeProvider } from 'next-themes'
import { AppProps } from 'next/app'
import { useState } from 'react'
type Props = AppProps & { colorScheme: ColorScheme }
export default function App({ Component, pageProps, colorScheme: _colorScheme }: Props) {
const [colorScheme, setColorScheme] = useState<ColorScheme>(_colorScheme)
const toggleColorScheme = (value?: ColorScheme) => {
const nextColorScheme = value || (colorScheme === 'dark' ? 'light' : 'dark')
setColorScheme(nextColorScheme)
setCookie('mantine-ui-colorScheme', nextColorScheme, { maxAge: 60 * 60 * 24 * 30 })
}
return (
<>
{/* need add next-themes failback */}
<Global styles={() => ({
':root': { background: '#fff', color: '#000' },
'[data-theme="dark"]': { background: '#1A1B1E', color: '#C1C2C5' }
})} />
{/* next-themes theme provider */}
<ThemeProvider enableSystem={false}>
{/* mantine color scheme provider */}
<ColorSchemeProvider colorScheme={colorScheme} toggleColorScheme={toggleColorScheme}>
<MantineProvider theme={{ colorScheme }} withGlobalStyles withNormalizeCSS>
<Component {...pageProps} />
</MantineProvider>
</ColorSchemeProvider>
</ThemeProvider>
</>
)
}
App.getInitialProps = ({ ctx }: { ctx: GetServerSidePropsContext }) => ({
colorScheme: getCookie('mantine-ui-colorScheme', ctx) || 'light',
})

在那之后，当我建立我的项目时，我得到了这个警告-

Warning: You have opted-out of Automatic Static Optimization due to `getInitialProps` in `pages/_app`. This does not opt-out pages with `getStaticProps`

如何消除此警告？

Answer 1

带有getInitialProps的页面按需运行。如果发生这种情况，next.js将无法执行自动静态优化。当Next.js检测到页面是静态的(可以预先呈现(时，就会使用ASO，这意味着它不需要阻塞数据。该确定是通过页面中不存在CCD_ 2和CCD_。

这就是为什么推荐getStaticProps而不是getInitialProps。

遗憾的是，getStaticProps在pages/_app上不可用。因此，我们可以在所有页面上添加getStaticProps。或者我们必须继续警告。