admin管理员组

文章数量:1425115

I'm developing a web app using nextjs. Everything works just fine on every browser, except for Safari on Mac. This is what I got when I open the developer console:

Only on Mac that this is happening, it can still run normally on an iPhone. Does anyone have an idea why this is happening?

I'm developing a web app using nextjs. Everything works just fine on every browser, except for Safari on Mac. This is what I got when I open the developer console:

Only on Mac that this is happening, it can still run normally on an iPhone. Does anyone have an idea why this is happening?

Share Improve this question asked Sep 23, 2021 at 5:30 William.DWilliam.D 1251 silver badge10 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 3

The IntersectionObserver API is not available on Safari v3.1-12. Either you or any of your libraries is using this API. To make it work on older versions of Safari, you need to polyfill it. Something like this should do the job for Safari v6+:

// pages/_app.jsx

import Script from 'next/script';

const App = ({ Component, pageProps }) => (
  <>
    <Script
      src="https://polyfill.io/v3/polyfill.min.js?features=IntersectionObserver"
      strategy="beforeInteractive"
    />
    <Component {...pageProps} />
  </>
);

export default App;

References:

  • https://caniuse./intersectionobserver
  • https://nextjs/docs/basic-features/supported-browsers-features#custom-polyfills
  • https://github./w3c/IntersectionObserver/tree/main/polyfill
  • https://nextjs/docs/basic-features/script#loading-polyfills
  • https://nextjs/docs/advanced-features/custom-app

本文标签: javascriptWhy my nextjs app doesn39t work on SafariStack Overflow