Как посмотреть код visual studio
Как просмотреть мой HTML-код в браузере с новым кодом Microsoft Visual Studio?
В Notepad ++ у вас есть возможность запускать в браузере. Как я могу сделать то же самое с кодом Visual Studio?
Ответьте на оба вопроса, чтобы открыть определенный файл (имя жестко запрограммировано) ИЛИ открыть ЛЮБОЙ другой файл.
шаги:
Используйте ctrl + shift + p (или F1 ), чтобы открыть палитру команд.
VS Code имеет расширение Live Server, которое поддерживает запуск в один клик из строки состояния.
Некоторые из особенностей:
- Запуск одним кликом из строки состояния
- Live Обновить
- Поддержка Chrome Debugging Attachment
Если у вас уже открыт хром, он запустит ваш html файл на новой вкладке.
Если вы хотите иметь живую перезагрузку, вы можете использовать gulp -webserver, который будет следить за вашими файлами и перезагружать страницу, так что вам не нужно нажимать F5 каждый раз на вашей странице:
Вот как это сделать:
Откройте командную строку (cmd) и введите
Введите Ctrl + Shift + P в коде VS и введите Настроить запуск задачи. Выберите его и нажмите клавишу ввода. Он откроет для вас файл tasks.json. Удалите все, начиная с конца, введите только следующий код
tasks.json
- В корневой каталог вашего проекта добавьте gulpfile.js и введите следующий код:
gulpfile.js
Теперь ваш веб-сервер откроет вашу страницу в браузере по умолчанию. Теперь любые изменения, которые вы будете делать с вашими страницами HTML или CSS, будут автоматически перезагружены.
Вы также можете запустить свою задачу, просто введя Ctrl + P и введите веб-сервер задач
Теперь вы можете установить расширение Просмотреть в браузере. Я тестировал его на окнах с хромом, и он работает.
версия vscode: 1.10.2
В linux вы можете использовать команду xdg-open , чтобы открыть файл с браузером по умолчанию:
Вот версия 2.0.0 для текущего документа в Chrome с сочетанием клавиш:
Для работы на веб-сервере:
Я просто повторяю шаги, которые я использовал из блога msdn . Это может помочь сообществу.
Это поможет вам настроить локальный веб-сервер, известный как lite-server, с VS Code , а также поможет вам разместить ваши статические html файлы в localhost и debug ваш код Javascript .
1. Установите Node.js
Если еще не установлен, получите его здесь
Он поставляется с npm (менеджер пакетов для приобретения и управления вашими библиотеками разработки)
2. Создайте новую папку для вашего проекта
Где-нибудь на вашем диске создайте новую папку для вашего веб-приложения.
3. Добавьте файл package.json в папку проекта
Затем скопируйте/вставьте следующий текст:
4. Установите веб-сервер
В окне терминала (командная строка в Windows), открытом в папке вашего проекта, выполните следующую команду:
Это установит lite-сервер (определенный в package.json), статический сервер, который загружает index.html в ваш браузер по умолчанию и автоматически обновляет его при изменении файлов приложения.
5. Запустите локальный веб-сервер!
(Предполагая, что у вас есть файл index.html в папке вашего проекта).
В том же окне терминала (командная строка в Windows) запустите эту команду:
Подождите секунду, и index.html загрузится и отобразится в вашем браузере по умолчанию, обслуживаемом вашим локальным веб-сервером!
lite-сервер следит за вашими файлами и обновляет страницу, как только вы вносите изменения в любые html, js или css файлы.
И если у вас VS Code настроен на автоматическое сохранение (меню Файл/Автосохранение), вы увидите изменения в браузере по мере ввода!
Заметки:
Это оно. Теперь перед любой сессией кодирования просто наберите npm start и все готово!
Первоначально размещено здесь в блоге msdn . @Laurent Duveau : @Laurent Duveau
Если вы только на Mac, это tasks.json файл:
Создайте tasks.json , как описано выше, и вызовите его с помощью ⌘ + shift + b .
Если вы хотите, чтобы он открывался в Chrome, тогда:
Это будет делать то, что вы хотите, как при открытии новой вкладки, если приложение уже открыто.
Решение одним кликом просто установите open-in-browser Расширения с рынка Visual Studio.
Если вы наберете > , он покажет вам команды show и run
Или в вашем случае с HTML, я думаю, F5 после открытия палитры команд должен открыть отладчик.
Открытие файлов в браузере Opera (в Windows 64 бит). Просто добавьте следующие строки:
Чтобы запустить эту задачу, откройте файл html, который хотите просмотреть, нажмите F1, введите task opera и нажмите enter
мой бегун script выглядит следующим образом:
и он просто открывает мой проводник, когда я нажимаю ctrl shift b в файле index.html
вот как вы можете запускать его в нескольких браузерах для Windows
- Используйте Command + shift + p , чтобы открыть палитру команд.
Один раз в файле tasks.json. Удалите отображаемый script и замените его на:
- Вернитесь в свой html файл и нажмите Command + shift + b , чтобы просмотреть свою страницу в Chrome.
Теперь нажмите Ctrl + K, а затем V, он откроет ваш HTML в ближайшей вкладке.
Вам интересно, почему vscode не имеет опции просмотра html по умолчанию, когда он может отображать html файл в режиме уценки?
Во всяком случае, это круто. Счастливого vscoding 🙂
Вот версия 2.0.0 для Mac OSx:
Для будущих разработчиков, которые придут сюда в поисках решения. Это удивительное расширение, которое довольно недавно называется Browser Preview от Кеннета Аухенберга, вы можете получить расширение с рынка. Как начать, вы можете проверить это репо, как начать с предварительного просмотра браузера
так. рабочий tasks.json для пользователей windows использующий vscode 1.34 :
-
Откройте код Visual Studio, затем перейдите к расширениям.
3. Установите его.
Откройте пользовательский Chrome с URL-адресом из приглашения
Открыть пользовательский Chrome с активным файлом
Notes
Вы не можете. Visual Studio не предназначалась для веб-дизайна или разработки. Вы должны закодировать некоторые строки, чтобы заставить его работать.
Как в Visual Studio for Web 2013 посмотреть не пользовательский код (то есть код из подключенных пространств имен)? Хочу установить там брекпойнт. Нашел в Object Browser лишь перечисление классов, но не сам код.
Брекпойнт можно поставить и без просмотра кода - не обязательно открывать код и нажимать на конкретной строчке F9. Можно поставить брекпойнт по имени функции.
Достаточно включить отладку чужого кода: снять чекбокс Debug/Options/Enable Just My Code.
Потом просто поставить брекпойнт:
- открыть Debug/New Breakpoint/Break at Function
- ввести имя класса и метода. Или просто имя метода Например брекпойт на "Update" поставит брекпойнты на все методы Update во всех классах во всех подключенных сборках.
- если будет показано окно с предупреждением - прочитать и проигнорировать
- проверить результат в окне Breakpoints
Если повезет, и если для стороннего кода есть проиндексированные отладочные символы - вам покажет исходный код. Если не повезет - то покажет только call stack, locals и переданные параметры - т.е. все кроме самих исходников.
Если вам нужна именна пошаговая отладка исходников:
Для другого кода, исходников которого у вас нет - можно воспользоваться бесплатным dotPeek или платными Resharper / Reflector - они умеют декомпилировать и генерировать индексированные отладочные символы для сторонних сборок.
47k 11 11 золотых знаков 74 74 серебряных знака 143 143 бронзовых знакаВы не можете поставить точку останова в коде, для которого у вас нету исходников и/или pdb-файлов (так называемые «символы»).
Если вы хотите отладить код сторонней библиотеки, это скорее всего не получится можно воспользоваться встроенной в Visual Studio 2019 поддержку декомпиляции. Она работает, начиная с версии 16.5. Для некоторых более ранних версий Студии поддержка можно тоже включить, но результат не гарантирован. «Под капотом» у этой декомпиляции находится проект ILSpy, которым можно пользоваться и отдельно.
С помощью отладчика Visual Studio можно переходить по коду для проверки состояния приложения и просмотра последовательности выполнения. Для быстрого перехода к коду, который необходимо изучить, можно использовать сочетания клавиш, команды отладки, точки останова и другие функции. Если вы знакомы с командами и сочетаниями клавиш для навигации по отладчику, вы можете быстро и с легкостью находить и устранять проблемы в работе приложений.
Если вы не знакомы с процессом отладки кода, перед выполнением задач в этой статье рекомендуется прочесть документ, посвященный отладке для начинающих, и статью Методы и инструменты отладки.
В режиме приостановки выполнения выполнение приложения приостанавливается, но функции, переменные и объекты при этом остаются в памяти. Когда отладчик находится в режиме приостановки выполнения, можно перемещаться по коду. Существует два стандартных способа быстрого перехода в режим приостановки выполнения:
Начните пошаговое выполнение кода, нажав клавишу F10 или F11. Это позволит быстро найти точку входа приложения. После этого можно продолжать нажимать команды перехода для перемещения по коду.
Например, в редакторе кода в Visual Studio можно использовать команду Выполнить до текущей позиции, чтобы запустить приложение, присоединить отладчик и перейти в режим приостановки выполнения, а затем нажать клавишу F11 для перехода по коду:
В режиме приостановки выполнения можно переходить по коду, используя различные команды. Можно выполнять поиск ошибок и нарушений целостности данных, проверяя значения переменных. Для некоторых типов проектов можно также вносить корректировки в приложение.
Большинство окон отладчика, таких как Модули и Контрольные значения, доступны только тогда, когда отладчик присоединен к приложению. Некоторые возможности отладчика, такие как просмотр значений переменных в окне локальных переменных или вычисление выражений в окне контрольных значений, доступны только при приостановке отладчика (то есть в режиме приостановки выполнения).
Если во время приостановки выполнения кода не загружены исходные файлы или файлы символов (PDB), отладчик отображает страницу Исходный файл не найден или Символы не найдены, которая поможет найти и загрузить файлы. См. статью Указание файлов символов (.pdb) и файлов с исходным кодом в отладчике Visual Studio. Если вы не можете загрузить исходные файлы или файлы символов, можно выполнить отладку инструкций на языке ассемблера в окне Дизассемблирование.
Пошаговое прохождение кода
С помощью команд пошагового выполнения отладчика можно проверять состояние приложения или изучать его последовательность выполнения.
Построчное выполнение кода
Для остановки выполнения на каждом операторе во время отладки используйте команду Отладка > Шаг с заходом или нажмите клавишу F11.
Отладчик осуществляет пошаговое выполнение операторов кода, а не физических строк. Например, предложение if может быть записано в одной строке:
Но при пошаговом выполнении этой строки отладчик рассматривает условие как один шаг, а результат — как другой шаг. В предыдущем примере условие выполняется.
При вызове вложенных функций команда Шаг с заходом позволяет попасть в самую глубокую вложенную функцию. Например, если использовать Шаг с заходом на вызове Func1(Func2()) , отладчик заходит в функцию Func2 .
При выполнении каждой строки кода можно наводить указатель мыши на переменные, чтобы просматривать их значения, или использовать окна Локальные переменные и Контрольные значения для наблюдения за изменением значений. Кроме того, можно визуально отслеживать стек вызовов при выполнении шагов с заходом в функции. (Сведения, касающиеся только Visual Studio Enterprise, см. в статье Сопоставление методов в визуализации стека вызовов при отладке.)
Пошаговое прохождение кода и пропуск некоторых функций
При отладке можно пропустить функцию. Или, возможно, вы знаете, что некоторый код работает, например, хорошо протестированный код библиотеки. Чтобы пропустить код во время пошагового выполнения, можно использовать приведенные ниже команды. Функции по-прежнему выполняются, но отладчик пропускает их.
| Команда с клавиатуры | Команда меню «Отладка» | Описание |
|---|---|---|
| F10 | Шаг с обходом | Если текущая строка содержит вызов функции, команда Шаг с обходом выполняет код, а затем останавливает выполнение в первой строке кода после возврата управления вызываемой функцией. |
| SHIFT+F11 | Шаг с выходом | Команда Шаг с выходом возобновляет выполнение кода и приостанавливает выполнение, когда текущая функция возвращает управление. Отладчик пропускает текущую функцию. |
Выполнение до указанного места или функции
Вам может потребоваться выполнить код непосредственно до определенного места или функции, если вы точно знаете, какой код нужно проверить или с какого места следует начать отладку.
Выполнение до точки останова в коде
Чтобы задать простую точку останова в коде, щелкните в левом поле напротив строки кода, в которой нужно приостановить выполнение. Можно также выбрать строку и нажать клавишу F9, выбрать команду Отладка > Переключить точку останова или щелкнуть правой кнопкой мыши и выбрать команду Точка останова > Вставить точку останова. Точка останова отображается как красный кружок в левом поле рядом со строкой кода. Отладчик приостанавливает выполнение непосредственно перед выполнением строки.
Точки останова в Visual Studio предоставляют широкий набор функций, таких как условные точки останова и точки трассировки. Дополнительные сведения см. в статье Использование точек останова.
Выполнение до точки останова функции
Можно дать отладчику команду на выполнение до тех пор, пока не будет достигнута определенная функция. Можно задать функцию по имени или выбрать ее из стека вызовов.
Указание точки останова функции по имени
Выберите команду Отладка > Создать точку останова > Точка останова функции.
В диалоговом окне Новая точка останова функции введите имя функции и выберите ее язык:
Щелкните ОК.
Если функция перегружается или находится в нескольких пространствах имен, нужную функцию можно выбрать в окне Точки останова:
Выбор точки останова функции из стека вызовов
Во время отладки откройте окно Стек вызовов, выбрав пункт Отладка > Окна > Стек вызовов.
В окне Стек вызовов щелкните правой кнопкой мыши имя функции и выберите команду Выполнить до текущей позиции или нажмите клавиши CTRL+F10.
Сведения о визуальном отслеживании стека вызовов см. в статье Сопоставление методов в визуализации стека вызовов при отладке.
Выполнение до расположения курсора
Чтобы выполнить код до позиции курсора, в окне исходного кода или в окне Стек вызовов выберите строку, в которой нужно прервать выполнение, а затем щелкните ее правой кнопкой мыши и выберите команду Выполнить до текущей позиции или нажмите клавиши CTRL+F10. Выбор команды Выполнить до текущей позиции аналогичен заданию временной точки останова.
Принудительное выполнение до расположения курсора
Чтобы выполнить код до позиции курсора, в окне исходного кода или в окне Стек вызовов выберите строку, в которой нужно прервать выполнение, а затем щелкните ее правой кнопкой мыши и выберите элемент Force Run To Cursor (Принудительное выполнение до расположения курсора). Если выбрать параметр Force Run To Cursor (Принудительное выполнение до расположения курсора), все точки останова и первичные исключения будут пропускаться, пока отладчик не достигнет строки кода, где находится курсор.
Выполнение до щелкнутого
Во время приостановки работы отладчика можно навести указатель мыши на оператор в исходном коде или в окне Дизассемблирование и щелкнуть значок с зеленой стрелкой Выполнить до этого места. Если используется команда Выполнение до щелкнутого позволяет не устанавливать временную точку останова.
Команда Выполнение до щелкнутого доступна начиная с версии Visual Studio 2017.
Принудительное выполнение до щелчка
Когда работа отладчика приостановлена, вы можете навести указатель на оператор в исходном коде, удерживая нажатой клавишу SHIFT, и выбрать элемент Принудительное выполнение до текущей позиции (значок с двумя зелеными стрелками). При выборе этого параметра приложение присоединяет отладчик Visual Studio и приостанавливает выполнение в положении курсора. Все точки останова и первичные исключения, обнаруженные во время выполнения, временно отключаются.
Параметр Force Run to Click (Принудительное выполнение до отмеченного щелчком расположения) доступен, начиная с версии Visual Studio 2022.
Приостановка выполнения кода вручную
Чтобы приостановить выполнение в следующей доступной строке кода в выполняющемся приложении, выберите команду Отладка > Прервать все или нажмите клавиши CTRL+ALT+BREAK.
Перемещение указателя для изменения потока выполнения
Когда работа отладчика приостановлена, желтая стрелка в поле исходного кода или в окне Дизассемблированный код отмечает расположение оператора, который должен быть выполнен следующим. Вы можете изменить следующий оператор, который будет выполняться, переместив эту стрелку. Можно пропустить код или вернуться к предыдущей строке. Перемещение указателя полезно при возникновении таких ситуаций, как пропуск кода, содержащего известную ошибку.
Для изменения оператора, который будет выполнен следующим, отладчик должен находиться в режиме приостановки выполнения. В окне исходного кода или окне Дизассемблированный код перетащите желтую стрелку в другую строку или щелкните правой кнопкой мыши строку, которую нужно выполнить следующей, и выберите команду Задать следующий оператор.
Счетчик программы переходит непосредственно к новому расположению. Инструкции между старой и новой точками не выполняются. Однако при перемещении точки выполнения обратно промежуточные инструкции не отменяются.
Отладка кода, не являющегося пользовательским
По умолчанию отладчик пытается выполнить отладку только кода вашего приложения, так как включена функция Только мой код. Подробнее о том, как эта функция работает с проектами различных типов и на разных языках, а также о том, как настроить ее, см. в статье Только мой код.
Для просмотра кода платформы, кода сторонней библиотеки или системных вызовов во время отладки можно отключить функцию "Только мой код". В меню Сервис (или Отладка) выберите пункты Параметры > Отладка и снимите флажок Включить только мой код. Когда функция "Только мой код" отключена, в окнах отладчика отображается код, не являющийся пользовательским, и отладчик может выполнять его по шагам.
Режим "Только мой код" не поддерживается для проектов устройств.
Отладка системного кода
Если вы загрузили отладочные символы для системного кода Майкрософт и отключили режим "Только мой код", можно производить шаг с заходом в системный вызов так же, как в любой другой вызов.
Сведения о загрузке символов Майкрософт см. в разделе Настройка расположения символов и параметров загрузки.
Чтобы загрузить символы для определенного системного компонента, выполните указанные ниже действия.
Во время отладки откройте окно Модули, выбрав пункт Отладка > Окна > Модули или нажав клавиши CTRL+ALT+U.
Определить, для каких модулей символы загружены, можно по значению в столбце Состояние символов в окне Модули. Щелкните правой кнопкой мыши модуль, для которого требуется загрузить символы, и выберите команду Загрузить символы.
Шаг с заходом в свойства и операторы в управляемом коде
По умолчанию отладчик обходит свойства и операторы при пошаговом выполнении в управляемом коде. В большинстве случаев это повышает удобство и эффективность отладки. Чтобы отключить пошаговое выполнение свойств и операторов, выберите пункт Отладка > Параметры. На странице Отладка > Общие снимите флажок Обход свойств и операторов (только управляемый код) .
Как просмотреть мой HTML-код в браузере с новым кодом Microsoft Visual Studio?
с Notepad++ у вас есть возможность запускать в браузере. Как я могу сделать то же самое с кодом Visual Studio?
использовать ctrl + shift + p (или F1 ), чтобы открыть палитру команд.
тип Настройка Task Runner. Выбрав его откроется элемент задач.json. Удалите отображаемый скрипт и замените его следующим:
Не забудьте изменить раздел" args " задач.json-файл с именем вашего файла. Это всегда будет открывать этот конкретный файл, когда вы нажмете F5.
вы также можете установить это, чтобы открыть любой файл, который вы открыли в то время с помощью ["$"] как значение для "args". Обратите внимание, что $ выходит за пределы <. >, Так что [""] is неправильный.
сохраните файл.
вернитесь к своему html-файлу (в этом примере это "текст.html"), и нажмите ctrl + shift + b для просмотра страницы в веб-браузере.
@InvisibleDev-чтобы получить эту работу на mac пытается использовать это:
Если у вас уже открыт chrome, он запустит ваш html-файл на новой вкладке.
открыть командную строку (cmd) и введите
npm install --save-dev gulp-webserver
введите Ctrl + Shift+P в VS код и тип Настройка Task Runner. Выбрать ее и нажмите enter. Это откроет задачи.файл JSON для вас. Удалить все из него конец введите только следующий код
- в корневой каталог вашего проекта добавьте gulpfile.JS и введите следующий код:
- теперь в VS код введите Ctrl + Shift+P и введите "выполнить задачу" , когда вы введете его, вы увидите свою задачу "webserver" выбран и нажмите enter.
- запуск одним щелчком мыши из строки состояния
- Live Reload
- поддержка приложения отладки Chrome
теперь вы можете установить расширение Просмотр В Браузере. Я тестировал его на windows с chrome, и он работает.
версия vscode: 1.10.2
в Linux, вы можете использовать xdg-open команда для открытия файла в браузере по умолчанию:
вот версия 2.0.0 для текущего документа в Chrome с сочетанием клавиш:
tasks.json
keybindings.json :
если вы просто на Mac это tasks.json file:
. это все, что вам нужно, чтобы открыть текущий файл в Safari, предполагая, что его расширение ".формат HTML."
создать tasks.json как описано выше, и запустите его с ⌘ + shift + b .
если вы хотите, чтобы он открылся в Chrome, то:
это будет делать то, что вы хотите, как при открытии в новой вкладке, если приложение уже открыто.
открытие файлов в браузере Opera (на 64 битах Windows). Просто добавьте эти строки:
обратите внимание на формат пути на "команды": линии. Не используйте "C:\path_to_exe\runme.формат exe".
чтобы запустить эту задачу, откройте html-файл, который вы хотите просмотреть, нажмите F1, введите task opera и нажмите enter
мой скрипт бегуна выглядит так:
и это просто открыть мой проводник, когда я нажимаю ctrl shift b в моем индексе.html файл
вот как вы можете запустить его в нескольких браузерах для Windows
обратите внимание, что я ничего не набирал в args для edge, потому что Edge-это мой браузер по умолчанию, просто дал ему имя файла.
EDIT: также вам не нужно-инкогнито и -private-window. it ' это только мне нравится, чтобы посмотреть его в частном окне
- использовать команда + shift + p чтобы открыть палитру команд.
введите Configure Task Runner, в первый раз, когда вы это сделаете, VS Code даст вам меню прокрутки вниз, если он выберет "другое."Если вы делали это раньше, VS Code просто отправит вас прямо в задачи.формат JSON.
один раз в задачах.файл json. Удалите отображаемый скрипт и замените его следующим:
- вернитесь к html-файлу и нажмите команда + Shift + b для просмотра страницы в Chrome.
один клик решение просто установить открыть в браузере расширения из Visual Studio marketplace.
Ctrl + F1 откроет браузер по умолчанию. кроме того, вы можете нажать Ctrl + shift + P, чтобы открыть командное окно и выбрать "просмотр в браузере". Html код должен быть сохранен в файл (несохраненный код в редакторе - без расширения, не работает)
недавно наткнулся на эту функцию в одном из учебников кода visual studio в www.lynda.com
нажмите Ctrl + K, а затем M, он откроет "выберите режим языка" (или нажмите на правый нижний угол, который говорит HTML перед этим смайликом), введите markdown и нажмите enter
Теперь нажмите Ctrl + K, а затем V, он откроет ваш html в соседней вкладке.
Tadaaa .
теперь команды emmet не работали в этом режим в моем html-файле, поэтому я вернулся в исходное состояние (Примечание - html-тег tellisense работал отлично )
чтобы перейти в исходное состояние-нажмите Ctrl + K, затем M, выберите автоопределение. команды Эммета начали работать. Если вы довольны только HTML viewer, то вам не нужно возвращаться в исходное состояние.
интересно, почему vscode не имеет опции просмотра html по умолчанию, когда он может отображать html-файл в markdown режим.
в любом случае это круто. Счастливый vscoding :)
вы не можете. Visual Studio не предназначалась для веб-дизайна или разработки. Вы должны закодировать некоторые строки, чтобы заставить его работать.
Читайте также: