SyntaxError: Unexpected token 'export' in Next.js-CodePudding

When I render the code below I get this error:

SyntaxError: Unexpected token 'export'

(project path)/node_modules/react-syntax-highlighter/dist/esm/styles/prism/index.js

It initially works as intended until I refresh the page.

import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
import { oneLight } from "react-syntax-highlighter/dist/esm/styles/prism";

const codeString = '(num) => num   1';

const Code = () => {
  return (
    <div>
      <SyntaxHighlighter language="javascript" style={oneLight}>
        {codeString}
      </SyntaxHighlighter>
    </div>
  );
};

export default Code;

EDIT: Solution:

use

react-syntax-highlighter/dist/cjs/...

instead of:

react-syntax-highlighter/dist/esm/...

CodePudding user response：

I searched a little and I found this. Maybe it's helpful