Monaco-jsx-highlighter get a webpack error

Question

I just one course Stepen Grid. Monaco-jsx-highligter get error. Here code:

    import 'bulmaswatch/superhero/bulmaswatch.min.css'
    import './code-editor.css'
    import Editor, { OnMount } from "@monaco-editor/react";
    import { useRef } from 'react';
    import pretier from 'prettier'
    import parser from 'prettier/parser-babel'
    import codeShift from 'jscodeshift'
    import Highlighter from 'monaco-jsx-highlighter'
    
    interface CodeEditorProps {
        initialValue: string,
        onChange(value:string): void ;
    }
    
    const CodeEditor : React.FC<CodeEditorProps> =  ({initialValue, onChange})=>{
        const editorRef = useRef<any>();
      
        const onMount:OnMount = (editor, monaco)=>{
    
            editorRef.current = editor;
            
            const highlighter = new Highlighter(
                //@ts-ignore
                window.monaco,
                codeShift,
                editor
            )
    
        }
        
        const onFormatOnClick = ()=>{
            const unformatted = initialValue
            
            const formatted = pretier.format(unformatted,{
                parser: 'babel',
                plugins: [parser],
                useTabs: false,
                semi: true,
                singleQuote: true
            }).replace(/\n$/, '')
    
            onChange(formatted)
        }
    
        return <div className='editor-wrapper'>
            <button onClick={onFormatOnClick} className="button button-format is-primary is-small">Format</button>
              <Editor theme="vs-dark" defaultLanguage="javascript"  height="500px"
    
                onMount={onMount}
                onChange={(value, event)=>onChange(value||"")}
                value={initialValue}
                
                options={{
                    wordWrap: 'on',
                    minimap: {enabled: false},
                    showUnused: false,
                    folding: false,
                    lineNumbersMinChars: 3,
                    fontSize: 16,
                    scrollBeyondLastLine: false,
                    automaticLayout: true
                }}
            />
            </div>
    }
    
    export default CodeEditor

terminal show this error:

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "assert": require.resolve("assert/") }' - install 'assert' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "assert": false }

How to fix it?