reactjs - 如何在 ReactTinyMCE 中添加自定义 Prism.js 样式以进行代码示例格式化和突出显示？

Question

这是我使用@tinymce/tinymce-react 的反应的 TinyMCE 配置。

我检查了如何添加自定义主题宽度 Prism.js，但它不起作用。我想使用okaidia主题

任何知道如何使用 tinymce && prism.js为codesample使用自定义样式而不是默认样式的人都可以提供帮助。

codesample 的默认格式如下所示，但我想使用okaidia主题并添加其他自定义棱镜样式。

import { Editor } from "@tinymce/tinymce-react";

const TextEditor = () => {
  const onChange = (e) => {
    console.log(e.target.getContent());
  };

  return (
    <div>
      <input
        id="my-file"
        type="file"
        name="my-file"
        style={{ display: "none" }}
        onChange=""
      />
      <Editor
        initialValue="<p>This is the initial content of the editor</p>"
        init={{
          selector: "textarea",
          plugins: "codesample image",
          toolbar: "codesample",
          codesample_global_prismjs: true,
          codesample_languages: [{ text: "Javascript", value: "javascript" }],
        }}
        onChange={onChange}
      />
    </div>
  );
};

export default TextEditor;