Pagina principala » Setul de instrumente » Cum se activează aplicația Chrome DevTools pentru depanare la distanță

    Cum se activează aplicația Chrome DevTools pentru depanare la distanță

    Aplicația Chrome DevTools este creată de Kenneth Auchenberg în încercarea de a scoate devtools din browser - în acest caz, din browserul Chrome. Această aplicație este construită pe baza NW.js și poate rula pe Mac OS X, precum și pe Linux și Windows.

    Există multe motive care au determinat creatorul să creeze acest lucru, dar viziunea sa constă în a da dezvoltatorilor confortul depanare la distanță în mai multe browsere, toate din aceeași platformă unificată (aplicație). Ideea va dura ceva timp pentru a prinde și a se materializa din diferite motive (și rezistență, pe care le puteți citi pe blogul său).

    Vom examina pe scurt aplicația Chrome DevTools și vom vedea ce Google are de oferit dezvoltatorilor.

    Mai multe despre Hongkiat:

    • Noțiuni de bază cu Instrumentele de dezvoltare Chrome
    • 5 (Mai mult) Sfaturi utile pentru Chrome DevTools pentru dezvoltatori
    • Cum de a personaliza tema DevTools pentru Google Chrome

    Instalare

    Descărcați Chrome-Devtools.app.zip și extrageți-l. Faceți dublu clic pentru a rula. Porniți browserul Chrome și activați depanarea la distanță.

    Pentru a face acest lucru pe Mac, deschideți terminalul și executați comanda de mai jos:

    sudo / Aplicații / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222

    Dacă executați Windows, deschideți Command Prompt și utilizați această comandă:

    porniți chrome.exe -remote-debugging-port = 9222

    Cum să utilizați

    Când Chrome este deja deschis, cu funcția de depanare la distanță activată, puteți naviga la orice site. De exemplu, am deschis Hongkiat.com pentru acest exercițiu. Apoi, ne îndreptăm spre fereastra de aplicații Chrome DevTools și reîmprospătați această listă (butonul este în partea dreaptă de jos).

    Acum veți vedea linkul Hongkiat.com listat (după cum se arată mai jos).

    Acum faceți clic pe butonul "Du-te". Veți fi duși într-o fereastră nouă. Asta e. Ai deja aplicația Chrome DevTools. Ce veți vedea aici este același lucru ca atunci când "inspectați elementul" pe browserul Chrome.

    Și de aici puteți utiliza aplicația Chrome DevTools la fel ca și utilizarea DevTools în Chrome: puteți inspecta elementul DOM, puteți depana JavaScript, puteți lucra cu Consola și mai multe.

    Ce urmeaza?

    Această aplicație este încă foarte experimentală. Dar, deocamdată, ideea de a scoate dispozitivul DevTool din Chrome îi permite dezvoltatorilor să trateze aplicația ca editor funcțional și să lucreze cu alte runtime, cum ar fi node.js și iOS. Pentru mai multe posibilități, puteți verifica trenul de gândire al lui Auchenberg aici.