close
Перейти к содержанию

WebStorm

Материал из Википедии — свободной энциклопедии
JetBrains WebStorm
Логотип программы JetBrains WebStorm
Тип Среда разработки
Разработчик JetBrains
Написана на Java
Операционная система Кроссплатформенное ПО
Дата выпуска 2010
Последняя версия 2026.1.2 (15 мая 2026 года)
Лицензия Проприетарная
Сайт jetbrains.com/ru-ru/webs…
Логотип Викисклада Медиафайлы на Викискладе

JetBrains WebStorm — интегрированная среда разработки на JavaScript, CSS & HTML от компании JetBrains, разработанная на основе платформы IntelliJ IDEA.

WebStorm обеспечивает автодополнение, анализ кода на лету, навигацию по коду, рефакторинг, отладку, и интеграцию с системами управления версиями. Важным преимуществом интегрированной среды разработки WebStorm является работа с проектами[1] (в том числе, рефакторинг кода JavaScript, находящегося в разных файлах и папках проекта, а также вложенного в HTML). Поддерживается множественная вложенность (когда в документ на HTML вложен скрипт на Javascript, в который вложен другой код HTML, внутри которого вложен Javascript) — то есть в таких конструкциях поддерживается корректный рефакторинг.

Основные возможности

[править | править код]

"Голый" WebStorm (без плагинов) не предоставляет возможностей, описанных ниже, однако, по умолчанию имеет более 100 установленных дополнений, которые обеспечивают поддержку и удобную разработку, используя самые разные JS-фреймворки, библиотеки, различные новшества CSS/HTML и т.д. Это лишь малая часть того, с чем WebStorm способен работать из коробки:

  • Модификация файлов .css, .html, .js с одновременным просмотром результатов (англ. Live Edit, в некоторых источниках эта функциональность называется «редактирование файлов на лету» или «в реальном времени» или «без перезагрузки страницы»)[2]
  • Поддержка HTML5
  • Поддержка JSDoc[3]
  • Поддержка Node.js
  • Поддержка React, JSX
  • Возможности Zen Coding и Emmet
  • Отладка кода на JavaScript
  • Удалённое развёртывание по протоколам FTP, SFTP, на монтированных сетевых дисках и т. д. с возможностью автоматической синхронизации
  • Интеграция с системами управления версиями: Subversion, Git, GitHub, Perforce, Mercurial, CVS поддерживаются из коробки с возможностью построения списка изменений и отложенных изменений
  • Интеграция с системами отслеживания ошибок

LiveEdit — новая возможность WebStorm, появившаяся в версии 5 и позволяющая одновременно редактировать код html, css или javascript и видеть, как результат отображается в браузере. Для этого требуется поддержка такой возможности со стороны браузера, поэтому WebStorm при установке ставит плагин для Google Chrome[4]. Плагин работает с браузерами Google Chrome и его производными.

Поддержка node.js

[править | править код]

WebStorm поддерживает отладку приложений в node.js. Также поддерживается полный набор функций редактирования приложений на javascript — как для исполнения на сервере, так и в браузере: автодополнение, навигация по коду, рефакторинг и проверка на ошибки.

Для node.js поддерживается также вывод сообщений node.js на отдельную вкладку в IDE.

LESS, Sass, SCSS, Stylus

[править | править код]

Языки стилей LESS, Sass, SCSS и Stylus которые расширяют возможности описаний стилей в CSS, полностью поддерживаются в WebStorm, в частности, поддерживается рефакторинг кода для них, когда надо изменить выражение (например, #a9a9a9) на переменную (например @grey), для того, чтобы сделать код более читаемым и проще переопределять параметры (например, путём присвоения им значения @grey: #a9a9a9).

Поддержка CoffeeScript, Dart, TypeScript

[править | править код]

В WebStorm для CoffeeScript, Dart и TypeScript есть навигация по коду, автодополнение, рефакторинг, подсветка синтаксиса и проверка на ошибки.

Поддержка JavaScript, HTML, CSS в IntelliJ IDEA

[править | править код]

JetBrains также разрабатывает и поддерживает другую среду разработки — IntelliJ IDEA с аналогичными возможностями по поддержке JavaScript, HTML и CSS. Следует заметить, что IntelliJ IDEA поддерживает не все теги и/или атрибуты стандарта HTML. Так, например, версия 12.1.6 не распознавала тег frameset. Версия 14.0.2 этот тег распознает, но не распознает его атрибут cols, отвечающий за размер и количество отдельных фреймов на странице.

Примечания

[править | править код]
  1. Introducing Html5, 2012, с. 2.
  2. Михаил Кобзарев. LiveEdit в PhpStorm. Дата обращения: 21 июня 2018. Архивировано 21 июня 2018 года.
  3. Pro Android, 2012, с. 104.
  4. Erez Zukerman. Review: WebStorm 5 IDE provides powerful editing features and instant feedback for Web developers (англ.). PCWorld (13 ноября 2012). Дата обращения: 30 января 2013. Архивировано 4 февраля 2013 года.

Литература

[править | править код]
  • Juriy Bura, Paul Coates. Pro Android Web Game Apps: Using HTML5, CSS3 and JavaScript. — Apress, 2012. — 664 p. ISBN 1430238194.
  • Jesse Freeman. Introducing Html5 Game Development. — O'Reilly Media, 2012. — 122 p. ISBN 1449315178.