Топ 5: Лучшие плагины редактора кода, написанные на Javascript

Разработка идет стремительно, в настоящее время у вас под рукой есть облачные интегрированные среды разработки, которые позволяют вам работать из любой точки мира. Важнейшим компонентом этих сервисов является редактор кода. Да, это поле, где вы редактируете свой код, и он выделяется причудливыми цветами, автозаполнением и другими вещами, которые (возможно) помогут вам работать быстрее.

Наслаждайтесь нашей коллекцией 5 лучших плагинов для редактора кода, написанных на Javascript.

5. EditArea

пример

Пример EditArea

EditArea — это бесплатный редактор JavaScript для исходного кода. Этот редактор предназначен для редактирования файлов исходного кода в текстовой области. Основная цель — разрешить форматирование текста, поиск и замену, а также выделение синтаксиса в реальном времени (для не слишком объемного текста).

EditArea разработан Christophe Dolivet и в настоящее время выпускается под лицензиями «LGPL», «Apache» и «BSD» (используйте ту, которая вам нужна), ознакомьтесь с лицензионным соглашением для получения подробной информации.

Характеристики

  • Легко интегрировать, только один скрипт включает и один вызов функции
  • Поддержка табуляции (позволяет писать хорошо отформатированный исходный код)
  • Настраиваемая подсветка синтаксиса в реальном времени (в настоящее время: PHP, CSS, Javascript, Python, HTML, XML, VB, C, CPP, SQL, Pascal, Basic, Brainf * ck и, возможно, многое другое …)
  • Поддержка переноса слов
  • Поиск и замена (с помощью регулярного выражения)
  • Авто-отступ новых строк
  • Нумерация строк
  • Поддержка мультиязычности (в настоящее время: хорватский, чешский, датский, голландский, английский, эсперанто, французский, немецкий, итальянский, японский, македонский, польский, португальский, русский, словацкий, испанский и, возможно, еще …)
  • Возможное сжатие PHP gzip (сжатие файлов ядра до одного файла ~ 25Ko)
  • Разрешить несколько экземпляров
  • Полноэкранный режим
  • Возможная интеграция с плагином
  • Возможно сохранение и загрузка функций обратного вызова
  • Возможное динамическое управление контентом
  • Может работать в той же среде, что и библиотеки «prototype» и «mootools».

Текущие ограничения:

  • автоматическая фокусировка на текстовой области при загрузке страницы.
  • может быть медленным при редактировании огромных файлов (javascript не является быстрым языком).
  • только на языке синтаксиса одновременно (нет подсветки синтаксиса html и php одновременно).

4. CodeFlask.js

Github

Редактор кодов

CodeFlask.js позволяет легко и без усилий разместить редактор кода на вашей веб-странице. Это было сделано как попытка создать более простой редактор для простых целей. Всего несколько строк кода, и вы готовы играть с кодом в браузере. Если вам нужен надежный веб-редактор кода, вы можете проверить проекты, которые имеют такие большие цели, такие как CodeMirror.

Для использования CodeFlask.js вам также необходимо импортировать Prism.js (для выделения кода) в ваш проект. Prism в основном использует два файла, .js файл и .css один (где вы можете тему синтаксиса кода).

3. Редактор Монако

Github | пример

Пример редактора Monaco

Monaco Editor — это редактор кода, который поддерживает VS Code, он лицензируется по лицензии MIT и поддерживает IE 9/10/11, Edge, Chrome, Firefox, Safari и Opera. Редактор Monaco не поддерживается в мобильных браузерах и мобильных веб-платформах.

Monaco Editor имеет богатый IntelliSense, валидацию для TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML.

Монако имеет полезную реализацию сравнения в реальном времени, которая поддерживает все языки:

Монако редактор Diff реализация

2. CodeMirror

Github

Пример Codemirror

CodeMirror — это универсальный текстовый редактор, реализованный на JavaScript для браузера. Он специализируется на редактировании кода и поставляется с более чем 100 языковыми режимами и различными дополнениями, которые реализуют более продвинутые функциональные возможности редактирования, богатым API программирования и системой тем CSS, которые доступны для настройки CodeMirror в соответствии с вашим приложением и расширения его новыми функциями.

Характеристики

1. ACE Editor

Github | пример

Пример Ace Editor

Ace — это высокопроизводительный редактор кода для Интернета, это встраиваемый редактор кода, написанный на JavaScript. Он соответствует функциям и производительности встроенных редакторов, таких как Sublime, Vim и TextMate. Он может быть легко встроен в любую веб-страницу и приложение JavaScript. Ace поддерживается в качестве основного редактора Cloud9 IDE и является преемником проекта Mozilla Skywriter (Bespin).

Особенности редактора Ace:

  • Подсветка синтаксиса для более чем 110 языков (можно импортировать файлы TextMate / Sublime Text.tmlanguage)
  • Более 20 тем (можно импортировать файлы TextMate / Sublime Text .tmtheme)
  • Автоматический отступ и отступ
  • Необязательная командная строка
  • Обрабатывает огромные документы (четыре миллиона строк, кажется, предел!)
  • Полностью настраиваемые привязки клавиш, включая режимы vim и Emacs
  • Поиск и замена с регулярными выражениями
  • Выделите соответствующие скобки
  • Переключение между мягкими вкладками и реальными вкладками
  • Отображает скрытые символы
  • Перетащите текст с помощью мыши
  • Перенос строки
  • Сворачивание кода
  • Несколько курсоров и выбор
  • Живая проверка синтаксиса (в настоящее время JavaScript / CoffeeScript / CSS / XQuery)
  • Вырезать, копировать и вставлять функциональность

Дополнительную информацию об использовании, включая события для прослушивания и расширения подсветки синтаксиса, можно найти на главном сайте Ace.

Если вы считаете, что мы забыли еще один замечательный плагин для редактора кода, поделитесь им с сообществом в поле для комментариев. Удачного кодирования!

Ссылка на основную публикацию
Adblock
detector