The dynamic()
function can also be used without a dynamic import:
// components/NoSsr.jsx
import dynamic from 'next/dynamic'
import React from 'react'
const NoSsr = props => (
<React.Fragment>{props.children}</React.Fragment>
)
export default dynamic(() => Promise.resolve(NoSsr), {
ssr: false
})
Anything wrapped in this component will not be visible in the SSR source. For example:
// inside the page you want to disable SSR for
import NoSsr from "components/NoSsr";
Contact me at <NoSsr>email@example.com</NoSsr>