Skip to main content

NextJS errors

Elliptic package error​

When using the SDK with NextJS 13 or 14 and the page router, you might encounter the following error:

import { ec, curves } from 'elliptic';
             ^^^^^^
SyntaxError: Named export 'curves' not found. The requested module 'elliptic' is a CommonJS module, which may not support all module.exports as named exports.

Why is this happening?​

This error is caused by the elliptic package (used in some SDK Stark functions), which is a CommonJS package. NextJS has experimental support for ESM externals, which is enabled by default. This feature is not yet stable and can cause issues with some packages.

How to fix this​

You can fix it by adding the following to your next.config.js:

const nextConfig = {
  // ... other next config
  experimental: {
    esmExternals: false,
  },
};

NextJS 13 with the App Router​

Currently, there is an issue with importing SDK modules and NextJS 13 using the App router. Importing SDK modules like this will cause NextJS to throw an error from the development server:

// This will not work
import { config, passport, x } from '@imtbl/sdk';

const { Environment, ImmutableConfiguration } = config;
const { Passport } = passport;
const { imxClientConfig, IMXClient } = x;

Importing SDK modules using the SDK Code Splitting method will fix this issue:

import { Environment, ImmutableConfiguration } from '@imtbl/sdk/config';
import { Passport } from '@imtbl/sdk/passport';
import { imxClientConfig, IMXClient } from '@imtbl/sdk/x';

Error creating wallet connection​

When using the SDK with NextJS 12, you might encounter the following error:

Error creating wallet connection TypeError: Cannot read properties of undefined (reading 'fromMasterSeed')
    at getPrivateKeyFromPath (file:///.../node_modules/@imtbl/sdk/dist/index.js:17536:10)
    at getKeyFromPath (file:///.../node_modules/@imtbl/sdk/dist/index.js:17543:28)
    at Object.generateLegacyStarkPrivateKey (file:///.../node_modules/@imtbl/sdk/dist/index.js:17617:23)

Why is this happening?​

This error is caused by the ethereumjs-wallet package (used in some SDK Stark functions), which is a CommonJS package. NextJS has experimental support for ESM externals, which is enabled by default. This feature is not yet stable and can cause issues with some packages.

How to fix this​

You can fix it by adding the following to your next.config.js:

const nextConfig = {
  // ... other next config
  experimental: {
    esmExternals: false,
  },
};