Sairaj Naik
Sairaj Naik

Reputation: 13

NextJS project compilation fails with JSEncrypt

I've installed JSEncrypt npm package for asymmetric encryption. But when I run the project I get the below error

Server Error ReferenceError: window is not defined

I even tried to dynamically load the JSEncrypt.min.js file in the project.

Can some one help resolving this?

Upvotes: 1

Views: 2352

Answers (2)

Seraphim Lou
Seraphim Lou

Reputation: 21

Use dynamic import provided by Next.js. Import JSEncrypt only when you need to use it instead of importing it at the top of a module. The code below works for me.

async function decrypt() {
  const JSEncrypt = (await import('jsencrypt')).default
  var encryptor = new JSEncrypt()
  /* DO SOMETHING */
}

Upvotes: 2

Nico
Nico

Reputation: 7266

Thats because window is not defined while Server Side Rendering.
Importing the component (where you are including JSEncrypt) with next/dynamic and SSR set to false should fix the issue.
Ex.

import dynamic from 'next/dynamic'
const ComponentWithJSEncrypt = dynamic(
  () => import('../components/myComponent'), // path of your component
  { ssr: false }
)

Upvotes: 0

Related Questions