Cannot use import statement outside a module

[VsevolodSynytskyi]

Hi 👋

I got an error when building my Next JS app.

Here is my setup

import { hotjar } from "react-hotjar";
/// ...
  useEffect(() => {
      hotjar.initialize(hotjarId, hotjarSnippetVersion);
    }
  }, []);
///...

The error:

import hotjarLib from './src/react-hotjar';
^^^^^^
SyntaxError: Cannot use import statement outside a module

Node v18.14.2 Next JS v13.0.7 react-hotjar v6.1.0

Do I miss anything? What can I do to avoid the error in my project?

[VsevolodSynytskyi]

I've solved it

  useEffect(() => {
    import("react-hotjar").then((hotjarLib) => {
      hotjarLib.hotjar.initialize(hotjarId, hotjarSnippetVersion);
    }, []);

The issue was related to static site generation. My app tried to execute react-hotjar lib on the server

[harrybailey]

useEffect(() => {
    import("react-hotjar").then((hotjarLib) => {
        hotjarLib.hotjar.initialize(hotjarId, hotjarSnippetVersion);
    });
}, []);