Редактирование в отладчике Chrome

Ответ 1

Вы можете использовать встроенный отладчик JavaScript в инструментах разработчика Chrome на вкладке "Сценарии" (в более поздних версиях это вкладка "Источники" ), но изменения, которые вы применяете к коду, выражаются только тогда, когда выполняется выполнение через них. Это означает, что изменения в коде, который не работает после загрузки страницы, не будут иметь эффекта. В отличие от, например, изменения кода, находящегося в обработчиках мыши, которые вы можете проверить на лету.

Есть видео с событиями ввода-вывода Google, в котором представлены другие возможности инструментов разработчика Chrome.

Ответ 2

Я наткнулся на это сегодня, когда я играл с кем-то другим сайтом.

Я понял, что могу привязать точку отрыва в отладчике к некоторой строке кода до, которую я хотел бы динамически редактировать. И поскольку точки останова остаются даже после перезагрузки страницы, я смог редактировать изменения, которые я хотел, остановив паузу в точке останова, а затем продолжал разрешать загрузку страницы.

Итак, как быстрая работа, и если она работает с вашей ситуацией:

• Добавьте точку прерывания в более раннюю точку в script
• Обновить страницу
• Измените свои изменения в коде
• CTRL + s (сохранить изменения)
• Отменить отладчик

Ответ 3

Это является удивительным руководством для отладчика Chrome. Он показывает очень простые шаги для внесения изменений в отладчик в ваши скрипты.

Ответ 4

Это то, что вы ищете:

1.- Перейдите на вкладку "Источник" и откройте файл javascript

2.- Отредактируйте файл, щелкните его правой кнопкой мыши и появится меню: нажмите Сохранить и сохраните его локально.

Чтобы просмотреть изменения или отменить изменения, щелкните правой кнопкой мыши и выберите в меню пункт Локальные изменения. Вы увидите изменения diff по отношению к исходному файлу, если вы развернете отображаемую временную метку.

Более подробная информация здесь: http://www.sitepoint.com/edit-source-files-in-chrome/

Ответ 5

Довольно легко перейти на вкладку "скрипты". И выберите нужный исходный файл и дважды щелкните любую строку, чтобы отредактировать его.

Ответ 6

Теперь Google Chrome представила новую функцию. С помощью этой функции вы можете редактировать код в режиме просмотра хрома. (Постоянное изменение местоположения кода)

Для этого нажмите F12 → вкладка "Источник" - (правая сторона) → Файловая система - в этом, пожалуйста, выберите свое местоположение кода. а затем браузер Chrome попросит вас разрешения, и после этого код будет раковиной с зеленым цветом. и вы можете изменить свой код, и он также будет отражать ваше местоположение кода (это означает, что он будет изменен постоянным)

Спасибо

Ответ 7

здесь нежное введение в js-отладчик в хром, который я написал. Возможно, это поможет другим, кто ищет информацию об этом: http://meeech.amihod.com/getting-started-with-javascript-debugging-in-chrome/

Ответ 8

Если его javascript, который запускается при нажатии кнопки, затем внесение изменений в Источники > Источники (в инструментах разработчика в хроме) и нажатие Ctrl + S для сохранения, достаточно. Я все время это делаю.

Если вы обновите страницу, ваши изменения в javascript исчезнут, но хром все равно сохранит ваши точки останова.

Ответ 9

вы можете редактировать файлы javascrpit динамически в отладчике Chrome, на вкладке Источники, однако ваши изменения будут потеряны, если вы обновите страницу, чтобы приостановить загрузку страницы, прежде чем делать изменения, вы будете необходимо установить точку останова, затем перезагрузить страницу и отредактировать свои изменения и, наконец, отключить отладчик, чтобы увидеть, как ваши изменения вступают в силу.

Ответ 10

Я искал способ изменить script и отладить новый script. Мне удалось это сделать:

• Установите точку останова в первой строке script, которую вы хотите изменить и отладить.

• Перезагрузите страницу, чтобы точка останова была поражена.

• Вставьте новый script и установите в нем желаемые точки останова

• Ctrl + s, и страница обновится, и эта точка останова в первой строке будет удалена.

• F8, и теперь ваш недавно вставленный script заменяет исходный, если не выполняются перенаправления и перезагрузки.

Ответ 11

Поскольку это довольно популярный вопрос, касающийся живого редактирования JS, я хочу указать еще один полезный вариант. Как описано svjacob в его ответе:

Я понял, что могу добавить точку прерывания в отладчике к некоторой строке кода до того, что я хотел бы динамически редактировать. И так как точки останова остаются даже после перезагрузки страницы, я смог редактировать изменения, которые я хотел, остановившись в точке останова, а затем продолжал доставлять нагрузку на страницу.

Вышеупомянутое решение не сработало для меня для довольно большого JS (пакет веб-пакетов - 3,1 МБ, версия с мини-версией, 130 тыс. строк кода в префизированной версии) - хром разбился и попросил перезагрузить страницу, которая вернула любые сохраненные изменения. В этом случае способ был Fiddler, где вы можете установить параметр AutoRespond для замены любого удаленного ресурса на любой локальный файл с вашего компьютера - см. Этот вопрос SO для подробности.

В моем случае мне также пришлось добавить заголовки CORS для скрипача, чтобы успешно имитировать ответ.

Ответ 12

В Chrome DevTools есть панель фрагментов, в которой вы можете создавать и редактировать код JavaScript так же, как и в редакторе, и выполнять его. Откройте DevTools, затем выберите панель "Источники", затем откройте вкладку "Отрывки".

https://developers.google.com/web/tools/chrome-devtools/snippets