Функция Live Edit в PhpStorm совместно с плагином под браузер Google Chrome позволяют редактировать PHP/HTML/CSS/JS в реальном времени без перезагрузки страницы. Вы правите что-то в среде разработки — результат моментально отображается в браузере.
Установка
- Запустите PhpStorm
- Откройте настройки (Ctrl+Alt+S)
- Перейдите в подраздел
Live Editи отметьте оба пункта для включения данного режима редактирования
Флажок Описание Enable live editing Включение/Выключение возможности править HTML, CSS, и JavaScript «на лету». Enable element highlighting in browser Включение/Выключение подсветки в браузере области редактирования В PhpStorm 6.0.2 плагин LiveEdit отсутствует по умолчанию, но его легко можно установить из репозитория. Идем по пути: File → Settings → Plugins → Browse repositories. В строке поиска вбиваем «LiveEdit». Жмём правой клавишей на найденном плагине и выбираем «Download and Install». Перезапускаем IDE
- Запустите Google Chrome
-
Скачайте по адресу http://localhost:63363/jb.crx плагин для браузера Google ChromeДля PhpStorm версии 5.0.3 скачайте расширение по адресу https://dl.dropbox.com/u/43511007/jb-3.10.crxДля PhpStorm с версии 5.0.4 используйте расширение из папкиПапка_с_PhpStorm/plugins/JavaScriptDebugger/extensions/jb.crx -
Откройте контекстное меню скачанного файла и нажмите «Показать в папке»
Для PhpStorm 6.0.2 просто установите расширение JetBrains IDE Support из репозитория Google Webstore
Откройте менеджер расширений Google Chrome chrome://chrome/extensions/ и перетащите скачанный файл расширения в это окно.
Для тех, кто не любит читать
Возможные проблемы
- CSS/JavaScript синхронизация и подсветка элементов не работает, когда открыт Web Inspector (голосуем за этот баг в Chrome).
- Расширение от Jetbrains не регистрируется в Google Chrome под Linux (Ubuntu). Фиксим при помощи:
sudo mkdir -p -m0777 /opt/google/chrome/extensions
- После обновления IDE перестает работать Live Edit. Попробуйте обновить расширения:
Меню → Инструменты → Расширения → Режим разработчика → Обновить расширения.
Ссылки
Источник: https://www.kobzarev.com/soft/liveedit-in-phpstorm/
