Syntax Highlighting for XML is not working

[mgoldenbe]

Version of react-ace: 9.4.1.

I wrote a small component to test XML syntax highlighting:

import React from 'react';
import 'ace-builds'
import AceEditor from 'react-ace';
// import mode-<language> , this imports the style and colors for the selected language.
import 'ace-builds/src-noconflict/mode-xml';
// there are many themes to import, I liked monokai.
import 'ace-builds/src-noconflict/theme-github';
// this is an optional import just improved the interaction.
import 'ace-builds/src-noconflict/ext-language_tools';
import 'ace-builds/src-noconflict/ext-beautify';

import ace from 'ace-builds/src-noconflict/ace'
// eslint-disable-next-line import/no-webpack-loader-syntax
import xmlWorkerUrl from "!!file-loader!ace-builds/src-noconflict/worker-xml";
ace.config.setModuleUrl("ace/mode/xml_worker", xmlWorkerUrl);


const Editor = ({setCode}) => {
    return (
        <AceEditor
        style={{
            height: '60vh',
            width: '60%',
        }}
        placeholder='Start Coding'
        mode='xml'
        theme='github'
        name='basic-code-editor'
        // onChange={code=>setCode(code)}
        fontSize={18}
        showPrintMargin={true}
        showGutter={true}
        highlightActiveLine={true}
        value={'Start coding'}
        setOptions={{
            enableBasicAutocompletion: true,
            enableLiveAutocompletion: true,
            enableSnippets: true,
            showLineNumbers: true,
            tabSize: 4,
        }}
        />
        )
    }
    
    export default Editor;

For some reason, the tags do not get highlighted. Am I missing something?

[belayaShlyapa]

Reading this issue, i tried add

import "ace-builds/src-noconflict/mode-xml

and

import "ace-builds/src-noconflict/theme-monokai"

for monokai theme.