Тема загрузки редактора Monaco без экземпляра - PullRequest
Новая
       25

Тема загрузки редактора Monaco без экземпляра

0 голосов
/ 04 августа 2020

Я создаю веб-приложение, использующее редактор Monaco Editor. Поскольку он уже загружен, я решил также использовать Monaco для подсветки синтаксиса кодовых блоков stati c.

На основе этого ответа мне удалось добавить подсветку синтаксиса в stati c блоки кода (добавляются элементы и имена классов.

Проблема в том, что связанный CSS загружается только в том случае, если создается экземпляр редактора Monaco, что происходит на другой странице. Это означает, что он только работает, если страница содержит экземпляр редактора Monaco.

Я использую следующий компонент React, чтобы добавить подсветку синтаксиса. 

import { editor } from 'monaco-editor';
import React, { ReactElement, useEffect, useRef } from 'react';

interface CodeBlockProps {
  /**
   * The code to render.
   */
  code: string;

  /**
   * The language to use for highlighting the code.
   */
  language: string;
}

/**
 * Render a code block using syntax highlighting based on Monaco editor.
 */
export default function CodeBlock({ code, language }: CodeBlockProps): ReactElement {
  const ref = useRef();

  useEffect(() => {
    if (language) {
      editor.colorizeElement(ref.current, { theme: 'vs' });
    }
  }, [language]);

  return (
    
      {code}
); }

Как заставить Monaco загружать CSS без создания экземпляра редактора?

...