Динамічне підсвічування синтаксису


Динамічне підсвічування синтаксису - це підсвічування коду, який користувач може змінювати. Це відбувається лише в одному місці: в онлайн-редакторі.

Note

Фрагменти коду, ітерації та подібне до них статичні, бо користувач не може змінювати свій код на льоту. Якщо хочеться дізнатися більше про те, як ми працюємо зі статичним підсвічуванням синтаксису, зазирніть до документації зі статичного підсвічування синтаксису.

Реалізація

Динамічне підсвічування синтаксису виконується за допомогою бібліотеки CodeMirror.

Додаючи підтримку мови, маємо три варіанти:

  1. Мову підтримує сам CodeMirror з коробки (тобто її внесено до списку підтримуваних мов). У такому разі переходьте до розділу Увімкнення мови.
  2. Мову підтримує наявний плагін CodeMirror. У такому разі переходьте до розділу Використання наявного плагіна.
  3. Мову не підтримано. І тут є три варіанти:
    1. Написати плагін CodeMirror з нуля, як описано в розділі Створення нового плагіна.
    2. Синтаксис мови (значною мірою) нагадує синтаксис іншої мови (наприклад, синтаксис Unison нагадує Haskell); у такому разі можна скористатися підсвічуванням синтаксису тієї мови для своєї. Докладніше див. у розділі Увімкнення мови.
    3. Не мати динамічного підсвічування синтаксису.

Увімкнення мови

Щоб увімкнути підтримку CodeMirror для своєї мови, створіть тему на форумі. Ми (Exercism) тоді створимо Pull Request, який увімкне підтримку CodeMirror для цієї мови на сайті.

Використання наявного плагіна

Щоб скористатися наявним плагіном, його потрібно опублікувати на NPM.

Якщо плагін не опубліковано на NPM, є такі варіанти:

  1. Запитати в автора плагіна, чи не хоче він опублікувати його на NPM.
  2. Зробити fork репозиторію і опублікувати його самостійно.
  3. Доручити нам (Exercism) зробити fork репозиторію, і ми його опублікуємо. Для цього створіть тему на форумі із цим проханням.

Наступний крок - увімкнення мови.

Створення нового плагіна

Ось із чого почати:

  1. Перевірте наш список репозиторіїв на наявність codemirror-lang-..., щоб переконатися, що такого ще немає.
  2. Створіть нову тему на форумі Exercism і розкажіть, для якої мови потрібен плагін CodeMirror.
  3. Коли репозиторій плагіна CodeMirror буде створено, реалізуйте граматику для своєї мови.
Note

Щоб було з чого почати, у створеному репозиторії є мінімальний зразок граматики, який можна взяти за основу й доопрацювати.

У нас неймовірно дружня й підтримувальна спільнота, яка радо допоможе, поки ми працюємо над цим! Якщо щось не виходить, створіть нову тему на форумі Exercism або за потреби додайте нові issues у exercism/exercism 🙂

Потім потрібно опублікувати плагін на NPM. Наступний крок - увімкнення мови.

Використання іншої мови

Синтаксис мови (значною мірою) нагадує синтаксис іншої мови, і тоді можна скористатися підсвічуванням синтаксису тієї мови для своєї. Для цього скористайтеся плагіном CodeMirror для тієї мови. Докладніше див. у розділі Увімкнення мови.