I get an error when importing a function in nextjs

Asked Apr 12 '21 at 01:14

Active Apr 12 '21 at 01:37

Viewed 90 times

I am using react-st-modal library to display modals and I am getting an error while importing a function from this library.

My import statement is:

const CustomDialogPromise = import("react-st-modal").then(
  (module) => module.CustomDialog
);

I am getting error:

SyntaxError: Cannot use import statement outside a module

UPDATE I put the import inside useEffect and it dissapeared. Now I'm getting a new error. There is a hook that react-st-modal exports called useDialog and I am importing it in this way:

let useDialog = null;
import("react-st-modal")
  .then((module) => module.useDialog)
  .then((dialog) => {
    useDialog = dialog;
  });

But then I get the same error as before.

edited Apr 12 '21 at 01:37

asked Apr 12 '21 at 01:14

user14850280

https://stackoverflow.com/questions/60392949/cannot-use-import-statement-outside-modules – Taki Apr 12 '21 at 01:16
no, its not applicable to nextjs – user14850280 Apr 12 '21 at 01:18
Are you importing this module inside useEffect? How are you using CustomDialogPromise? – lissettdm Apr 12 '21 at 01:23
put it in useEffect and it worked. i am now getting a new error. please see the updated question – user14850280 Apr 12 '21 at 01:37
1

I found out how to fix this thanks to this post: https://stackoverflow.com/questions/66244968/nextjs-react-hook-mousetrap-cannot-use-import-statement-outside-a-module – user14850280 Apr 12 '21 at 02:15
Why don't you tried import { useDialog } from 'react-st-modal';? – lissettdm Apr 12 '21 at 02:23

I get an error when importing a function in nextjs

0 Answers0