Úvodná » toolkit » Ako povoliť aplikáciu Chrome DevTools pre vzdialené ladenie

    Ako povoliť aplikáciu Chrome DevTools pre vzdialené ladenie

    Aplikácia Chrome DevTools je vytvorená spoločnosťou Kenneth Auchenberg v snahe vylúčiť devtooly z prehliadača - v tomto prípade z prehliadača Chrome. Táto aplikácia je postavená na platforme NW.js a môže byť spustená v systéme Mac OS X, ako aj v systéme Linux a Windows.

    Existuje veľa dôvodov, ktoré prinútili výrobcu vytvoriť to, ale jeho vízia spočíva v tom, že vývojári dávajú pohodlie vzdialené ladenie vo viacerých prehliadačoch, všetky z rovnakej jednotnej platformy (aplikácie). Táto myšlienka bude trvať nejaký čas, aby sa chytila ​​a materializovala z rôznych dôvodov (a odporu, ktorý si môžete prečítať na svojom blogu).

    Stručne sa pozrieme na aplikáciu Chrome DevTools a uvidíme, čo Google ponúka vývojárom.

    Viac informácií o Hongkiatu:

    • Začíname s nástrojmi vývojára prehliadača Chrome
    • 5 (Viac) Užitočné tipy Chrome DevTools pre vývojárov
    • Ako prispôsobiť tému aplikácie Google Chrome DevTools

    inštalácia

    Prevezmite Chrome-Devtools.app.zip a extrahujte ho. Dvakrát kliknite na spustenie. Spustite prehliadač Chrome a povoľte vzdialené ladenie.

    Ak to chcete robiť na počítači Mac, otvorte terminál a spustite príkaz nižšie:

    sudo / Aplikácie / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222

    Ak spustíte systém Windows, otvorte príkazový riadok a použite tento príkaz:

    spustiť chrome.exe -remote-debugging-port = 9222

    Ako použiť

    Keď je váš prehliadač Chrome už otvorený a aktivovaná funkcia vzdialeného ladenia, môžete teraz prehliadať ľubovoľné stránky. Napríklad pre toto cvičenie sme otvorili Hongkiat.com. Ďalej prejdeme k oknu aplikácie Chrome DevTools a obnoviť tento zoznam (tlačidlo sa nachádza v pravej dolnej časti).

    Teraz uvidíte odkaz Hongkiat.com uvedený (ako je uvedené nižšie).

    teraz kliknite na tlačidlo "Prejsť". Dostanete sa do nového okna. To je všetko. Aplikácia Chrome DevTools už máte spustenú. Čo uvidíte tu, je to isté ako pri "kontrole elementu" v prehliadači Chrome.

    A tu môžete aplikáciu Chrome DevTools používať rovnako ako pri použití nástroja DevTools v prehliadači Chrome: môžete skontrolovať prvok DOM, ladiť JavaScript, pracovať s konzolou a inými.

    Čo bude ďalej?

    Táto aplikácia je stále veľmi experimentálna. Zatiaľ však myšlienka prevzatia nástroja DevTool z prehliadača Chrome umožňuje vývojárom spracovanie aplikácie ako funkčného editora a prácu s ďalšími časmi, ako napríklad node.js a iOS. Pre viac možností si môžete pozrieť Auchenbergovu cestu myslenia tu.