Super expression error in Nextjs 13

Supper expression error

Super expression must either be null or a function error occurs while try to declare and use client side component as server component, i.e, in Nextjs 13 app 📂.

Solution

I got this error while trying to implement a code highlighter. Moving the component from other than the app folder won't help.

What I do is simply covert the component into client by placing use client declaration on the top of the component, before import.

 
//Super expression must either be null or a function
'use client';
import React from 'react'
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
import { duotoneSea } from 'react-syntax-highlighter/dist/esm/styles/prism';

export default function Code(props){
    return (
       <>
    
    <SyntaxHighlighter language="javascript" style={duotoneSea}>
        {props.children}
        </SyntaxHighlighter>
       </>
    )
}