Рубрики
Без рубрики

Расширить языковую конфигурацию в редакторе Monaco

Monaco Editor – онлайн -редактор с синтаксисом. Он предлагает поддержку синтаксиса для … с меткой JavaScript, Monacoeditor, VSCODE, Microsoft.

Monaco Editor – онлайн -редактор с синтаксисом. По умолчанию он предлагает поддержку синтаксиса для многих языков. Но нам может понадобиться Пользовательский синтаксис выделения Чтобы соответствовать нашей реальной жизни использования. К сожалению, нет доступного API для расширения языковой конфигурации, обратитесь к этому комментарий

Согласно совету, я перезаписал Выход встроенного токенизатора

Оглавление

  • Как я подошел
  • Фактический код
  • Преимущества
  • Ограничения
  • Забрать
  • Ссылка GitHub
  • Запуск приложения

Как я подошел

  1. Я взял все языковые конфигурации, которые доступны в редакторе Monaco, используя API monaco.languages.getlanguages ()
  2. Затем я отфильтровал желаемый язык (в моем случае я взял JavaScript )
  3. Будет метод с именем Loader () , который будет доступен для большинства зарегистрированных языков
  4. При выполнении загрузчика он вернет объект, содержащий 2 именованных клавиша, Конфигурация и язык
  5. Этот язык будет хранить данные токенизатора
  6. Я взял этот токенизатор и изменил определенные детали с помощью моих пользовательских токенов
  7. Модификация выполняется таким образом, чтобы Ссылка на базовый объект не затронута

Фактический код

const allLangs = await monaco.languages.getLanguages();
const { conf, language: jsLang } = allLangs.find(({ id }) => id ==='javascript').loader();
for (let key in customTokenizer) {
  const value = customTokenizer[key];
  if (key === 'tokenizer') {
    for (let category in value) {
      const tokenDefs = value[category];
      if (!jsLang.tokenizer.hasOwnProperty(category)) {
        jsLang.tokenizer[category] = [];
      }
      if (Array.isArray(tokenDefs)) {
        jsLang.tokenizer[category].unshift.apply(jsLang.tokenizer[category], tokenDefs)
      }
    }
  } else if (Array.isArray(value)) {
    if (!jsLang.hasOwnProperty(key)) {
      jsLang[key] = [];
    }
    jsLang[key].unshift.apply(jsLang[key], value)
  }
}

Преимущества

  1. В Монако-редакторе, JavaScript Worker предоставляет отличные завершения кода , Если мы создадим новый языковой токенизатор, мы можем потерять эти предложения. Этот метод избегает необходимости нового языка, поэтому сохраняет завершение кода
  2. Этот пользовательский токенизатор следует монарху монарха Монако , Так что, если вы уже написали пользовательские токенизаторы, это будет легко для миграции
  3. Токены добавляются таким образом, чтобы Пользовательские токены имеют высокий приоритет и это также может быть изменено путем изменения непрерывно к push в jslang ключи

Ограничения

Как редактор Monaco, как хранит языковую конфигурацию в экземпляре Monaco, мы должны перезаписать языковую конфигурацию Перед созданием любого модели (или) редактора На этом желаемом языке

Забрать

Этот метод возможен только из -за Ленивая функция загрузки Monaco Редактор (Благодаря команде Monaco Editor), где он загружает языковую конфигурацию только тогда, когда для этого языка создается экземпляр редактора модели (или) модели (или)

Поэтому, если мы сможем изменить конфигурацию языка до того, как Монако его использует, мы сможем достичь желаемой настройки

Ссылка GitHub

Ссылка профиля: Pranomvignesh

Ссылка хранилища: Расширить языковую конфигурацию в редакторе Monaco

Оригинал: “https://dev.to/pranomvignesh/extend-language-configuration-in-monaco-editor-5fjo”