#ReferenceError: window is not defined

[EmirOmerov]

Hello, first I want to thank you for creating this amazing Card component. Second I have and issue that i can't fix with it. I'm using it on my React-NextJS project and it all went well and then suddenly it's starts poping these error messages about window not defined in node_modules\react-payment-card-component\lib\index.js:1:6721. Please can you help me out. Would be really thankful. Cheers.

[MauriceMcErlean]

Hey, This is an issue with the library using window and the script is trying to run server side, in which case a window doesn't exist.

You can use Dynamic to pull import the library. See (https://nextjs.org/docs/advanced-features/dynamic-import).

At the top of your file you import 'next/dynamic', and then dynamically import 'react-payment-card-component'.

import dynamic from 'next/dynamic'
const PaymentCard = dynamic(() => import('react-payment-card-component'),
    {
        ssr: false
    }
);

[EmirOmerov]

Hey, This is an issue with the library using window and the script is trying to run server side, in which case a window doesn't exist.

You can use Dynamic to pull import the library. See (https://nextjs.org/docs/advanced-features/dynamic-import).

At the top of your file you import 'next/dynamic', and then dynamically import 'react-payment-card-component'.

import dynamic from 'next/dynamic'
const PaymentCard = dynamic(() => import('react-payment-card-component'),
    {
        ssr: false
    }
);

thank you like a lot :D