Домашняя » Инструментарий » Как включить приложение Chrome DevTools для удаленной отладки

    Как включить приложение Chrome DevTools для удаленной отладки

    Приложение Chrome DevTools создано Кеннетом Аухенбергом в попытке вывести devtools из браузера - в данном случае из браузера Chrome. Это приложение построено на основе NW.js и может работать на Mac OS X, а также на Linux и Windows.

    Есть много причин, побудивших производителя создать это, но его видение состоит в том, чтобы предоставить разработчикам удобство удаленная отладка в нескольких браузерах с единой платформы (приложение). Идея займет некоторое время, чтобы ее реализовать и воплотить в жизнь по ряду причин (и сопротивления, о котором вы можете прочитать в его блоге).

    Мы кратко рассмотрим приложение Chrome DevTools и посмотрим, что Google может предложить разработчикам..

    Больше на Hongkiat:

    • Начало работы с инструментами разработчика Chrome
    • 5 (Больше) полезных советов по Chrome DevTools для разработчиков
    • Как настроить тему Google Chrome DevTools

    Монтаж

    Загрузите Chrome-Devtools.app.zip и распакуйте его. Дважды щелкните, чтобы запустить. Запустите браузер Chrome и включите удаленную отладку.

    Чтобы сделать это на Mac, откройте терминал и выполните команду ниже:

    sudo / Applications / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222

    Если вы запустите Windows, откройте командную строку и используйте эту команду:

    start chrome.exe -remote-debugging-port = 9222

    Как пользоваться

    Когда Chrome уже открыт с включенной функцией удаленной отладки, вы можете перейти на любой сайт. Например, мы открыли Hongkiat.com для этого упражнения. Затем мы переходим в окно приложения Chrome DevTools и обновить этот список (кнопка внизу справа).

    Теперь вы увидите ссылку Hongkiat.com в списке (как показано ниже).

    Сейчас нажмите кнопку «Перейти». Вы попадете в новое окно. Вот и все. У вас уже запущено приложение Chrome DevTools. Здесь вы увидите то же самое, что и при «проверке элемента» в браузере Chrome..

    И отсюда вы можете использовать приложение Chrome DevTools точно так же, как и DevTools в Chrome: вы можете проверять элемент DOM, отлаживать JavaScript, работать с консолью и многое другое..

    Что дальше?

    Это приложение все еще очень экспериментально. Но на данный момент идея вывести DevTool из Chrome позволяет разработчикам рассматривать приложение как функциональный редактор и работать с другими средами выполнения, такими как node.js и iOS. Для большего количества возможностей, вы можете проверить ход мыслей Аухенберга здесь.