Highlight.js“找不到‘未定义’语言,您是否忘记加载/包含语言模块?”

7 javascript syntax-highlighting reactjs highlight.js froala

我在 React 中使用highlight.js 作为 Froala 编辑器代码块。但我遇到了错误。我使用了 registerLanguage 函数,但它不起作用。

浏览器错误:

在此输入图像描述

这是我的代码:

import FroalaEditor from 'react-froala-wysiwyg';
import hljs from 'highlight.js';
import javascript from 'highlight.js/lib/languages/javascript';
import 'highlight.js/styles/androidstudio.css';

hljs.registerLanguage('javascript', javascript)


export default function Editor({ handleEditor, data }: EditorType) {
  return (
    <div className="unreset">
      <FroalaEditor
        tag="textarea"
        onModelChange={handleEditor}
        model={data}
        config={{
          placeholderText: '',
          events: {
            //editor event
            contentChanged: function () {
              //.fr-element is editor wrapper tag
              document
                .querySelectorAll('.fr-element pre')
                .forEach((el: any) => {
                  // WARN: Falling back to no-highlight mode for this block. 
                  hljs.highlightElement(el);
                });
            },
          },
        
        }}
      />
    </div>
  );
}
Run Code Online (Sandbox Code Playgroud)

为什么不起作用?谢谢。