Отстраняване на грешки в хромирани Инструментите за програмисти

Този превод на статията Мат Deslorersa - «изчистване на грешки Node.js в Chrome Инструментите за програмисти», оригиналът на която може да бъде намерена в неговия блог тук.

Този пост е въведение към нов подход на развитие, отстраняване на грешки и профилиране приложения Node.js използване Chrome Инструментите за програмисти.

Аз наскоро е работил по програма devtool команден ред. Node.js програма, която работи вътре Chrome Инструментите за програмисти.

Запис на предавания за определяне на точки на прекъсване в рамките на HTTP сървър.

Тази програма се основава на електрона. който е смес от възможности Node.js и хром. Тази програма е предназначена да осигури прост интерфейс за отстраняване на грешки, профилиране, както и разработването на Node.js приложения.

Можете да настроите devtool, използвайки NPM:

В известен смисъл, можем да използваме като възел команда смяна devtool в конзолата. Например, можете да отворите REPL по този начин:

Това ще постави началото на нов екземпляр на Chrome Инструментите за програмисти с подкрепата на всички възможности на Node.js:

Отстраняване на грешки в хромирани Инструментите за програмисти

Няколко други примери:

дизайн

Можем да използваме devtool за непрекъснато развитие и прилагане на който и да е модул, вместо на съществуващите услуги, като nodemon.

Тази команда ще пускате app.js в Chrome Инструментите за програмисти конзола. Тъй като ние уточни използване --watch флаг към конзолата при запазване на файла се презарежда автоматично.

Отстраняване на грешки в хромирани Инструментите за програмисти

Кликнете на линка app.js: 1. което ще ни доведе до съответния файл и ред в раздела Източници.

Отстраняване на грешки в хромирани Инструментите за програмисти

Отстраняване на грешки в хромирани Инструментите за програмисти

Тъй като ние имаме достъп до раздела Източници. След това можем да го използваме за отстраняване на грешки нашата молба. Можете да задавате точки на прекъсване и след това рестартирайте дебъгер (Cmd / Ctrl + R), или можете да зададете началната отправна точка с --break на знамето.

Отстраняване на грешки в хромирани Инструментите за програмисти

Ето няколко функции, които може да не са непосредствено очевидни за тези, които току-що са започнали да се научат Инструментите за програмисти Chrome:

Докато дебъгер е на пауза, можете да натиснете клавиша Escape. За да отворите конзолата, която се движи в настоящия обхват. Можете да промените стойностите на променливите, а след това продължи.

профилиране

Друг вариант е да се използва devtool профилиране приложения като browserify. преглъщане и Бабел.

Тук използваме console.profile () - възможност за Chrome за профилиране колектор натоварване на процесора.

Сега тече devtool с нашия файл:

След извършване, можем да видим резултата в раздела Профили.

Отстраняване на грешки в хромирани Инструментите за програмисти

Отстраняване на грешки в хромирани Инструментите за програмисти

Още опции за търсене

експерименти

Chrome постоянно добавя нови функции и експерименти в неговите Инструментите за програмисти, като обещания инспектор. Можете да го активирате, като кликнете трите точки в горния десен ъгъл и изберете Настройки → експерименти.

Отстраняване на грешки в хромирани Инструментите за програмисти

След включване на, натиснете клавиша за бягство. за задействане на инспектора обещания.

Отстраняване на грешки в хромирани Инструментите за програмисти

След натискане на Shift 6 пъти в страницата за експерименти отворите повече експериментални възможности, включително нестабилна.

--console флаг

Можете да пренасочите изхода към конзолата обратно към терминала (process.stdout и process.stderr), която дава възможност за сключване на имиджа.

Знамена - и process.argv

Vyshi скриптове може да се анализира process.argv, както и в прилагането на обичайните Node.js. Ако ви дам нещо, което да спре напълно команда (-) в devtool. тя ще бъде достъпна като нов елемент от масива process.argv. Например:

Сега, скрипта ви може да изглежда така:

Flag --quit и --headless

Flag --quit завършва процеса с код за изход от 1 е достигнато, когато грешка (напр синтактична грешка или незабелязана изключение) на.

--headless флаг позволява Инструментите за програмисти да не се отварят при стартиране. Това може да се използва за командния ред скриптове:

Flag --browser поле

Някои модули могат да предоставят входна точка, че е най-добре работи в браузъра. Можете да използвате --browser поле знаме в подкрепа package.json знамена. когато това се изисква модули.

Например, можем да използваме XHR заявка. която използва XHR технологии, необходими "браузър" област.

Сега можем да се запознаят с исканията в раздела Мрежа:

Отстраняване на грешки в хромирани Инструментите за програмисти

Flag --no-възли таймери

По подразбиране, ние предлагаме глобален setTimeout и setInterval. който се държи както и в Node.js, връщайки обект unred () и код () функции).

Въпреки това, можете да ги изключим, за по-добра поддръжка асинхронен стека.

Отстраняване на грешки в хромирани Инструментите за програмисти

Можете да добавите .devtoolrc файл в текущата директория, която съдържа допълнителни параметри като флаговете на V8.

Вижте тук за повече информация.

капани

От вашето приложение работи в среда браузър (Electron) и не е вярно среда Node.js, той може да отговори на капаните. че трябва да сте наясно.

Вече има някои дебъгерите за Node.js, така че може да се интересуват от различията между тях.

WebStorm Debugger

Отстраняване на грешки в хромирани Инструментите за програмисти

Въпреки това, той не разполага с някои функции и полски Инструментите за програмисти Chrome:

  • Луксозни и интерактивен Console
  • Пауза на изключения
  • Asynchronous стека
  • инспектор обещания
  • профили

Тъй като това се интегрира с вашия космически WebStrom работа, можете да правите промени и да редактирате вашите файлове, а отстраняване на грешки. Също така да се отбележи, е, че тя работи в реалния свят възел / V8, за разлика от devtool. така че е по-надеждна дебъгер за широк спектър от приложения Node.js.

Отстраняване на грешки в хромирани Инструментите за програмисти

Приличаше на дебъгер въз основа на Електрон. Тя включва вграден команден да компилирате местните добавки и сложен графичен интерфейс, който показва package.json и README.md.

devtool предоставя различни възможности за Node.js (и двете require.main. setTimeout и process.exit) и предефиниране на вътрешните механизми на изходните карти (източник карти), а също така има по-добра манипулатор грешка, контролни точки инжекция и "браузър" област.

възел-инспектор

Отстраняване на грешки в хромирани Инструментите за програмисти

Може също като възел-инспектор, предлага да се използват за дистанционно отстраняване на грешки, вместо да използвате приложения в Electron среда.

Това означава, че кодът ще се работи в тази Node.js околната среда, без да се прозорец или друг браузър / Electron API, които могат да замърсят района и да предизвика проблеми с някои модули. Той има пълната подкрепа на големи Node.js приложения (включително родния добавки), и осигурява по-голям контрол над Инструментите за програмисти например (това е, можете да използвате точки на прекъсване и инспектира искания).

Въпреки това, тъй като тя отново изпълнява повечето от функциите за отстраняване на грешки, тя може да бъде бавен и тромав, както често се намалява, което води до чувство на неудовлетвореност сред разработчиците.

В същото време, devtool се опитва да даде на разработчиците вече известни на тях инструменти (Chrome Инструментите за програмисти), както и насърчаване на други функции, като например Browser / Electron API на.

Споделяне на плащане на хостинг или кафе.
Колкото по-често се пие кафе, толкова повече аз пиша статията.