Контрольные точки Javascript в Visual Studio 2017

Я только что установил Visual Studio 2017. После запуска приложения ASP.NET MVC я получаю сообщение о том, что chrome-отладка в Visual Studio включена.

Но мои точки останова в Visual Studio не пострадают. Точки останова на коде Razor, похоже, работают, но Javascript этого не делает. Точки останова не полностью красные, как и должно быть. Перезапуск, перестройка не оказывают никакого влияния.

У меня есть следующий пример кода

@Html.Partial("_Test", Model.Test) // debugging works here

<script>
    var i = 1;
    console.log(i); // debugging does not work here or above
</script>

@section scripts {
    <script>
        var a = 11;
        console.log(a); // debugging does not work here or above
    </script>
}

У меня нет консоли для отладки хром, и я проверил этот параметр в Visual Studio ( "Включить отладку Javascript.." ), который включен.

Согласно этому сообщению в блоге, я думал, что это должно работать: https://blogs.msdn.microsoft.com/webdev/2016/11/21/client-side-debugging-of-asp-net-projects-in-google-chrome/

Я что-то упустил? Может быть, это не работает в Visual Studio 2017 каким-то образом?

У меня есть только одно расширение, и это Resharper, но я думаю, это не проблема.

Ответы

Ответ 1

Эта функция не работает для кода javascript внутри файла *.cshtml, но только для кода в отдельных файлах *.js(или *.ts).

введите описание изображения здесь Обратите внимание, как точка останова в файле JavaScript активна, а точка останова в представлении Razor отсутствует.

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

Ответ 2

Еще один совет: js debug можно включить только после установки "стартового URL" в run/debug.

Только таким образом VS будет подключаться к браузеру.

Ответ 3

Я была такая же проблема. Я следовал инструкциям из того же поста: https://blogs.msdn.microsoft.com/webdev/2016/11/21/client-side-debugging-of-asp-net-projects-in-google-chrome/

Я сделал следующее в Visual Studio: Перейдите в ToolsOptionsDebuggingGeneral и отключил параметр "Включить отладку JavaScript для ASP.NET(Chrome и IE)". Сохраненные изменения, затем запустите веб-страницу.

После этого я заметил, что Chrome не отображал "Отладочную веб-страницу" перед загрузкой моей страницы. Затем я закрыл свою веб-страницу и остановил сеанс отладки.

Я снова включил параметр "Включить отладку Javascript для ASP.NET(Chrome и IE)", затем запустил веб-страницу с помощью IE, и это сработало. Страница остановилась, и в моей визуальной студии появилась точка останова.

Ответ 4

У меня была такая же проблема, но новая для ядра .net, решение, которое работало для меня, заключалось в добавлении отладчика; в верхней части script:

<script>
  debugger;

  -- rest of your jscript here
</script>

Ответ 5

Он работает только в версии 2017 только с возможностью включения "Включить Javascript Debugging для ASP.NET(Chrome и IE)" и установить отладчик; в js-коде в *.cshtml, а также в файле *.js

Ответ 6

Подумав, что единственный способ добиться этой BundleTable.EnableOptimizations = true; это исправить Visual Studio 2017 с помощью установщика, я понял, что у нас есть BundleTable.EnableOptimizations = true; в Bundle.config. Я удалил эту строку и добавил ее в преобразование Web.Debug.config и она начала работать как положено.

Ответ 7

Два варианта, которые вы могли бы попробовать:

  • Отключите "Включить отладку JavaScript для ASP.NET(Chrome и IE)" в параметрах VS, а затем используйте отладчик (F12) в вашем браузере.
  • Запустите отладку в Visual Studio, а затем добавьте точки останова в Solution Explorer -> Internet Explorer -> <your view name>. (Предполагается, что вы используете IE)

Ответ 8

Мое лучшее предположение здесь (по крайней мере, в моем случае, возможно, и в вашем случае), что это связано с комплектацией. Проект, над которым я сейчас работаю, объединяет отдельные сценарии в один сценарий Big Daddy (без минимизации в конфигурации отладки), поэтому я догадываюсь, что VS не будет сопоставлять мою точку останова с этим конечным сценарием, выполняемым в браузере.

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

Ответ 9

Для тех, кто использует Google Chrome Portable (или добавил Chrome в список отладки браузера вручную), помогает это:

https://docs.microsoft.com/en-us/visualstudio/javascript/tutorial-nodejs-with-react-and-jsx?view=vs-2017#set-and-hit-a-breakpoint-in-the- на стороне клиента реагируют код

Вам нужно потом прикрепить к нужному экземпляру Chrome вручную и альту

Ответ 10

  • Visual Studio Professional 2017 версия 15.8.1
  • Chrome версии 68.0.3440.106 (официальная сборка) (64-разрядная версия)

Мне пришлось включить Legacy Chrome JavaScript отладчик в:

Параметры → Инструменты → Отладка → Общие → Включить устаревший отладчик Chrome JavaScript для ASP.NET

Ответ 11

Если вы запустите Visual Studio 15.9.12 от имени администратора и попытаетесь поместить точку останова в коде javascript, даже в файле .cshtml, автоматически появится окно с просьбой включить отладку JavaScript.

Всплывающее окно Visual Studio "Предупреждение об отладке JavaScript"

Однако, по крайней мере, для меня, даже если теперь он достигает точек останова, я не могу проверить переменные, либо наведя на них курсор (всплывающее окно просто не будет отображаться), либо добавив их в окно просмотра (произойдет error CS0103: The name of 'variableNameHere' does not exist in the current context.).