我知道在使用NextJS时,NextJS提供_document.js
来制作全局头标签,但我不想使用_document.js
。我有两个不同的页面,假设它是 Home 和 About 页面,我想将 About 页面设为 amp 页面,将 Home 设为普通 HTML 页面。我如何实现这一目标?
最佳答案
假设您有正确版本的 Nextjs,您应该能够使用 withAmp
高阶组件包装您的页面:
import { withAmp } from 'next/amp'
...
export default withAmp(Page)
如果您希望能够根据页面是否支持 Amp 有条件地渲染组件,则可以使用 hybrid
和 useAmp
(假设您将组件编写为一个函数组件)。
import { withAmp, useAmp } from 'next/amp'
...
const Page = () => {
const isAmp = useAmp()
return (
{isAmp ? <AmpComponent /> : <NonAmpComponent /> }
)
}
...
export default withAmp(Page, { hybrid: true })
但是,根据我目前的经验,这会导致附加样式表的问题,该样式表通常对于 Amp 的限制来说太长。希望 Zeit 在未来的版本中解决这个问题。
关于reactjs - 如何在 NextJS 中分离 amp-page 和 not amp-page?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47276603/