Как сохранить файл в Visual Studio Code

Обновлено: 05.07.2024

Visual Studio Code — один из самых популярных и мощных текстовых редакторов, используемых сегодня разработчиками программного обеспечения.

В этой статье мы рассмотрим шаги, необходимые для загрузки популярного текстового редактора Visual Studio Code, также называемого VS Code. К концу статьи вы сможете создать в Visual Studio Code папку, содержащую HTML-документ, который можно открыть в веб-браузере.

Я. Введение

Что такое «текстовые редакторы»?

Текстовые редакторы, также называемые редакторами кода, представляют собой приложения, используемые разработчиками для написания кода. Они могут выделить и отформатировать ваш код, чтобы его было легче читать и понимать. Если вы использовали Codecademy, вы уже знакомы с текстовым редактором. Это область, в которой вы пишете свой код.

Использование текстового редактора является частью создания вашей "среды разработки", набора инструментов, которые вы используете для работы над проектами кодирования. Это позволит вам взять то, чему вы научились на Codecademy, и применить это на практике, когда вы работаете над проектами на своем компьютере. Это не только познакомит вас с инструментами, которые обычно используются профессиональными разработчиками, но также означает, что вы выросли как разработчик и готовы начать работать самостоятельно — отличная работа!

Текстовые редакторы, предназначенные для написания кода, имеют ряд преимуществ:

  • Подсветка синтаксиса для конкретного языка
  • Автоматический отступ кода
  • Цветовые схемы в соответствии с вашими предпочтениями и облегчают чтение кода.
  • Подключаемые модули или дополнительные программы для обнаружения ошибок в коде.
  • Древовидное представление или визуальное представление папок и файлов проекта для удобной навигации по проекту.
  • Сочетания клавиш или их комбинации для ускорения разработки

Возможно, вы также читали или слышали об интегрированных средах разработки или «интегрированных редакторах разработки». IDE позволяет не только редактировать, но также компилировать и отлаживать код с помощью одного приложения или интерфейса. Хотя текстовый редактор, который мы рекомендуем, не считается IDE, он имеет множество функций, подобных IDE, которые упрощают жизнь разработчика, не требуя большого количества ресурсов, которые обычно требуются для IDE. Лучшее из обоих миров!

Выбор текстового редактора

На выбор предлагается несколько текстовых редакторов. Например, Visual Studio Code — один из самых популярных текстовых редакторов, используемых разработчиками. (Это Visual Studio Code, а не Visual Studio, который немного отличается. Нам нужен первый, тот, в названии которого есть «Code».) Другими популярными текстовыми редакторами, о которых вы, возможно, слышали, являются Atom и Sublime Text.

  • Бесплатно
  • Открытый исходный код (это означает, что код программы можно просматривать, изменять и публиковать)
  • Функции, подобные IDE
  • Поддерживается большим сообществом пользователей и Microsoft

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

II. Установка кода Visual Studio

Итак, мы выбрали наш текстовый редактор, теперь нам просто нужно установить его на наш компьютер!

Видеоинструкции

В этом видео показано, как загрузить и установить Visual Studio Code. Письменные инструкции приведены ниже.

Этапы установки

Процесс установки для компьютеров под управлением macOS, Windows и Linux (в частности, Ubuntu и Debian) будет очень похожим, и использование Visual Studio Code на всех них будет одинаковым.

Посетите веб-сайт Visual Studio Code, чтобы загрузить последнюю версию Visual Studio Code.

Вы должны увидеть, что отображается операционная система вашего компьютера, но если она неверна, нажмите стрелку вниз и найдите параметр, соответствующий вашей операционной системе, в раскрывающемся меню, а затем щелкните значок стрелки вниз в разделе «Стабильная».< /p>

Пользователи Windows: будет загружена последняя версия Visual Studio Code в виде файла .exe.

Пользователи Mac: будет загружена последняя версия Visual Studio Code для Mac в виде ZIP-файла.

Пользователи Linux: .deb и .rpm — это разные типы файлов для хранения данных. Мы предлагаем вам скачать файл .deb, чтобы автоматические обновления работали так, как предлагает документация Visual Studio Code.

После завершения загрузки файла Visual Studio Code его необходимо установить. Найдите файл Visual Studio Code в файловом менеджере — программе, позволяющей просматривать файлы и папки на вашем компьютере.

Пользователи Windows: откройте файл .exe, щелкнув его, и запустите программу установки. Продолжайте нажимать «Далее», а затем «Готово».

Пользователям Mac: загруженный ZIP-файл должен находиться в папке «Загрузки». Откройте файл. Если вы видите это сообщение, выберите «Открыть».

Пользователям Linux: загруженный файл должен находиться в папке «Загрузки».

Найдите его в файловом менеджере, дважды щелкните и выберите «Установить» в центре программного обеспечения с графическим интерфейсом или выполните следующие команды по одной в терминале:

Убедитесь, что ваше приложение Visual Studio Code сохранено в месте, где, как вы знаете, вы легко сможете его найти.

Пользователи Windows: он будет автоматически помещен в меню "Пуск".

Пользователи Mac: нажмите и перетащите значок Visual Studio Code из папки "Загрузки" в папку "Приложения".

Пользователи Linux: он должен появиться на панели задач программ.

Вот и все, вы успешно установили текстовый редактор и готовы приступить к написанию кода!

III. Практика: используйте Visual Studio Code для запуска проекта вне платформы

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

Для этого нам понадобится текстовый редактор, который мы установили выше. Давайте на минутку попробуем Visual Studio Code.

Что такое «папки разработки»?

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

Большинство разработчиков хранят свои проекты в удобном для поиска каталоге (который вы, возможно, привыкли называть «папкой»). Здесь, в Codecademy, мы рекомендуем называть этот каталог проектами. Он будет хранить все ваши проекты кодирования. Всякий раз, когда вы создаете новый проект, независимо от того, насколько он мал, вы всегда должны создавать новую папку внутри каталога ваших проектов. Вы обнаружите, что проекты из одного файла могут быстро превратиться в большие проекты с несколькими папками.

Практика: создадим проект

Ниже приведены шаги, которые необходимо выполнить, чтобы создать новую папку для всех ваших программных проектов. Вы также узнаете, как загрузить новую папку проекта в Visual Studio Code и создать свой первый HTML-проект «Hello World».

Мы рекомендуем вам просмотреть приведенное выше видео, а затем выполнить описанные ниже действия.

1. Создайте папку разработки.

Перейдите к папке с помощью файлового менеджера или терминала. Убедитесь, что это папка, которую вы посещаете регулярно и будете помнить. Создайте новую папку под названием проекты.

Пользователи Mac: это может быть ваша учетная запись пользователя или папка «Домашняя».

Пользователи Windows: вы можете сохранить это на диск C.

Пользователям Linux: вы можете сохранить это в папке пользователя в папке «Домашняя».

В папке проектов создайте новую папку с именем HelloWorld. Все, что вы добавите в эту папку, станет частью вашего проекта HelloWorld.

2. Откройте код Visual Studio
3. Откройте папку разработки

Нажмите значок «Проводник» в меню слева, затем нажмите кнопку «Открыть папку» и выберите папку разработки. Это запустит ваш файловый менеджер.

Перейдите к папке HelloWorld и выберите Открыть. Папка откроется на боковой панели Visual Studio Code. На данный момент в папке не должно быть содержимого. Мы добавим файл на следующем шаге.

4. Добавьте файл.

Прежде чем вы научитесь добавлять файлы в папку проекта, важно понять назначение расширений файлов. Расширение файла — это суффикс имени файла (последние 3 или 4 символа в имени файла, которым предшествует точка) и описывает тип содержимого, содержащегося в файле. Например, расширение HTML-файла — .html, и оно указывает браузеру (и другим приложениям) интерпретировать содержимое файла как HTML-документ. После того как Visual Studio Code загрузит папку проекта, вы можете добавлять файлы. Шаги ниже описывают, как добавить файлы. Не беспокойтесь о том, чтобы сделать это на своем собственном компьютере. Мы вернемся к этому позже.

На панели проводника Visual Studio Code щелкните имя папки разработки. Вы увидите четыре значка справа от имени папки. Щелкните значок «Новый файл». Введите имя нового файла с соответствующим расширением (например, .html, .css, .csv). Крайне важно указать правильное расширение файла, чтобы такие программы, как линтеры, знали, как интерпретировать его содержимое. Когда закончите, нажмите Enter.

5. Начинайте программировать!

Скопируйте и вставьте следующий стандартный HTML-код:

Почаще сохраняйте файл с помощью функции автоматического сохранения и отслеживайте изменения с помощью системы контроля версий, если вы знаете, как ею пользоваться. (Чтобы включить автосохранение, нажмите «Файл», а затем «Автосохранение». Когда оно включено, вы увидите галочку рядом с «Автосохранение».) Это уменьшит вероятность потери несохраненной работы.

Расширения файлов и подсветка синтаксиса

Синтаксис – это набор правил, которые говорят нам, как создавать правильно написанный код.Visual Studio Code и другие текстовые редакторы могут интерпретировать расширения файлов и обеспечивать подсветку синтаксиса для конкретного языка. Подсветка синтаксиса — это инструмент, облегчающий чтение кода. Взгляните на свой файл index.html. Текст и теги разного цвета. Вот как Visual Studio Code выделяет синтаксис .html. С каждым новым языком, который вы изучаете, Visual Studio Code будет выделять текст таким образом, чтобы ваш код было легко читать. Это может отличаться от других текстовых редакторов, а также отличаться от того, как ваш код выделяется в Codecademy.

Необязательно: измените цветовую схему

Хотя Visual Studio Code поставляется с подсветкой синтаксиса по умолчанию, вы можете изменить используемые цвета. Хорошие цветовые темы сделают чтение всех этих строк кода легким для ваших глаз. (Попробуйте низкоконтрастные темные темы, такие как «Solarized Dark» или «Dracula Dark».)

Для этого выберите «Цветовая тема» на странице приветствия при первом открытии Visual Studio Code или нажмите «Код» в строке меню в верхней части окна рабочего стола, затем нажмите «Настройки», а затем «Цветовая тема». Вы также можете искать цветовые темы для установки с помощью меню «Расширения».

6. Просмотрите свой HTML-файл в браузере

На этом этапе ваш файл готов для просмотра в веб-браузере. Следующие шаги следует предпринять вне Visual Studio Code:

Перейдите к файлу index.html в папке Hello World с помощью файлового менеджера или терминала.

Дважды щелкните или откройте index.html. Страница должна открыться в веб-браузере по умолчанию. Восхищайтесь своей работой на втором месте — вы создали свой первый проект с помощью Visual Studio Code.

Расширьте возможности Visual Studio Code

Если вы уже освоились с предыдущими шагами, изучите следующие функции для дальнейшей настройки среды разработки. Вам не нужно использовать эти предложения для завершения проектов в Codecademy, но они могут помочь вам повысить эффективность при написании кода, и это то, что делает Visual Studio Code таким полезным редактором!

Отладка кода в редакторе: правильно, вы можете запускать и тестировать код из редактора!

Контроль версий: вам не нужно переключаться на терминал на вашем компьютере, чтобы отслеживать изменения с помощью Git.

Встроенный терминал: вы можете запускать команды командной строки из своего редактора с помощью Visual Studio Code.

IV. Подведение итогов

Поздравляем! Вы успешно настроили текстовый редактор и готовы создавать веб-сайты на своем компьютере.

По своей сути Visual Studio Code — это редактор кода. Как и многие другие редакторы кода, VS Code использует общий пользовательский интерфейс и расположение проводника слева, показывающего все файлы и папки, к которым у вас есть доступ, и редактора справа, показывающего содержимое открытых файлов. .

Кроме того, в пользовательском интерфейсе VS Code есть ряд уникальных функций. В этом разделе описываются эти функции.

Файлы, папки и проекты

VS Code основан на файлах и папках — вы можете сразу приступить к работе, открыв файл или папку в VS Code.

Базовый макет

VS Code поставляется с простой и интуитивно понятной компоновкой, которая максимально увеличивает пространство, отведенное для редактора, и оставляет достаточно места для просмотра и доступа к полному контексту вашей папки или проекта. Пользовательский интерфейс разделен на четыре области:

  • Редактировать основную область для редактирования файлов. Вы можете открыть до трех редакторов рядом
  • Боковая панель содержит различные представления, такие как Проводник, которые помогут вам в работе над проектом.
  • В строке состояния отображается информация об открытом проекте и файлах, которые вы редактируете.
  • Панель просмотра в крайнем левом углу позволяет переключаться между представлениями и предоставляет дополнительные зависящие от контекста индикаторы, например количество исходящих изменений при включенном Git.

Каждый раз, когда вы запускаете VS Code, он открывается в том же состоянии, в котором он был при последнем закрытии. Папка, макет и открытые файлы сохраняются.

VS Code Layout

Вместо того, чтобы размещать файлы на отдельных вкладках, VS Code позволяет одновременно использовать до трех видимых редакторов, что позволяет размещать до трех файлов рядом друг с другом.

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

Совет. Вы можете переместить боковую панель вправо (Просмотр > Переместить боковую панель) или изменить ее видимость ( kb(workbench.action.toggleSidebarVisibility) ).

Редактирование рядом

У вас может быть открыто до трех редакторов рядом.

Если у вас уже открыт один редактор, есть несколько способов открыть другой редактор сбоку от существующего:

  • kbstyle(Ctrl) (Mac: kbstyle('Cmd') ) щелкните файл в проводнике
  • kb(workbench.action.splitEditor), чтобы разделить активный редактор на два
  • Открыть в сторону из контекстного меню Проводника в файле

Редактирование рядом

Каждый раз, когда вы открываете другой файл, активный редактор отображает содержимое этого файла. Поэтому, если у вас есть два редактора рядом и вы хотите открыть файл «foo.cs» в правом редакторе, убедитесь, что этот редактор активен (щелкнув внутри него), прежде чем открывать файл «foo.cs».

Если у вас открыто несколько редакторов, вы можете быстро переключаться между ними, удерживая клавишу kbstyle(Ctrl) (Mac: kbstyle('Cmd')) и нажимая kbstyle(1), kbstyle(2) или kbstyle( 3) .

Совет. Вы можете изменить размер редакторов и их порядок. Перетащите область заголовка редактора, чтобы изменить положение или размер редактора.

Проводник

Проводник используется для просмотра, открытия и управления всеми файлами и папками в вашем проекте.

  • создавать, удалять и переименовывать файлы и папки
  • перемещать файлы и папки с помощью перетаскивания
  • используйте контекстное меню, чтобы изучить все параметры

Совет. Вы можете перетаскивать файлы в проводник из-за пределов VS Code, чтобы скопировать их

Меню проводника< бр />

VS Code очень хорошо работает с другими инструментами, которые вы можете использовать, особенно с инструментами командной строки. Если вы хотите запустить инструмент командной строки в контексте папки, которая в данный момент открыта в VS Code, щелкните папку правой кнопкой мыши и выберите «Открыть в командной строке» (или «Открыть в терминале» в OS X или Linux).

Вы также можете перейти к расположению файла или папки в собственном проводнике, щелкнув файл или папку правой кнопкой мыши и выбрав «Показать в проводнике» (или «Показать в Finder» на Mac или «Открыть содержащую папку» в Linux).< /p>

Совет. Введите kb(workbench.action.quickOpen) (Быстрое открытие), чтобы быстро найти и открыть файл по его имени.

По умолчанию VS Code исключает некоторые папки из проводника (например, .git ). Используйте параметр files.exclude, чтобы настроить правила скрытия файлов и папок в проводнике.

Совет. Это очень полезно для скрытия файлов производных ресурсов, таких как \*.meta в Unity или \*.js в проекте TypeScript. Чтобы Unity исключила файлы \*.cs.meta, нужно выбрать следующий шаблон: "**/*.cs.meta": true . Для TypeScript вы можете исключить сгенерированный JavaScript для файлов TypeScript с помощью: "**/*.js": .

Рабочие файлы

В верхней части Проводника находится раздел РАБОЧИЕ ФАЙЛЫ. Это список активных файлов. Это файлы, которые вы ранее открывали в VS Code, над которыми вы работаете. Например, файл будет указан в разделе рабочих файлов, если вы:

  • внести изменения в файл
  • дважды щелкните файл в проводнике
  • открыть файл, который не является частью текущей папки

Раздел рабочих файлов

Представьте, что раздел РАБОЧИЕ ФАЙЛЫ похож на вкладки, с которыми вы, возможно, знакомы в других редакторах кода или IDE. Просто щелкните файл в разделе рабочих файлов, и он станет активным в VS Code.

После выполнения задачи вы можете удалить файлы по отдельности из раздела рабочих файлов или удалить все файлы из раздела рабочих файлов с помощью действия "Закрыть все файлы".

Совет. Вы можете ввести kb(workbench.files.action.workingFilesPicker), чтобы перемещаться по списку рабочих файлов из средства выбора файлов, не открывая проводник.

Настройка редактора

VS Code предоставляет множество возможностей для настройки редактора. Вы можете установить параметры глобально через настройки пользователя или для каждого проекта/папки через настройки рабочей области. Значения настроек хранятся в файле settings.json.

Выберите Files > Preferences > User Settings (или нажмите kb(workbench.action.showCommands) , введите user и нажмите Enter ), чтобы отредактировать файл user settings.json.

Выберите Files > Preferences > Workspace Settings (или нажмите kb(workbench.action.showCommands), введите workp и нажмите Enter ), чтобы отредактировать файл workspace settings.json.

Вы увидите настройки VS Code по умолчанию в левом окне и ваш редактируемый файл settings.json в правом. Вы можете легко просматривать и копировать настройки из настроек по умолчанию.

После редактирования настроек введите kb(workbench.action.files.save), чтобы сохранить изменения. Изменения вступят в силу немедленно.

Сохранить/автосохранить

По умолчанию VS Code требует явного действия для сохранения изменений на диск, kb(workbench.action.files.save) .

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

Чтобы настроить автосохранение , откройте Настройки пользователя или Настройки рабочей области и найдите соответствующие настройки:

  • files.autoSave : можно выбрать значения off для отключения автоматического сохранения, afterDelay для сохранения файлов после настроенной задержки и onFocusChange для сохранения файлов, когда фокус перемещается из редактора грязного файла.
  • files.autoSaveDelay : настраивает задержку в миллисекундах, когда для files.autoSave установлено значение afterDelay .

Поиск в файлах

VS Code позволяет быстро выполнять поиск по всем файлам в текущей открытой папке. Просто введите kb(workbench.view.search) и введите поисковый запрос. Результаты поиска группируются в файлы, содержащие искомый термин, с указанием совпадений в каждом файле и его местонахождении. Разверните файл, чтобы увидеть предварительный просмотр всех обращений в этом файле. Затем нажмите один раз на одно из обращений, чтобы просмотреть его в редакторе.

Простой текстовый поиск по файлам

Совет. Мы также поддерживаем поиск по регулярным выражениям в окне поиска.

Вы можете настроить параметры расширенного поиска, введя kb(workbench.action.search.toggleQueryDetails) . Это покажет дополнительные поля для настройки поиска.

Расширенные параметры поиска

В двух полях ввода под окном поиска вы можете включать и исключать файлы. Нажмите на переключатель справа, чтобы включить синтаксис шаблона глобуса:

  • * для соответствия одному или нескольким символам в сегменте пути
    • <ли>? для сопоставления одного символа в сегменте пути
  • ** для соответствия любому количеству сегментов пути, включая ни одного.
  • <> для группировки условий (например, <**/*.html,**/*.txt>соответствует всем HTML и текстовым файлам)
  • [] для объявления диапазона совпадающих символов (например, example.5 для сопоставления с example.0 , example.1 , …)

VS Code по умолчанию исключает некоторые папки, чтобы уменьшить количество результатов поиска, которые вас не интересуют (например: node_modules ). Откройте настройки, чтобы изменить эти правила в разделах files.exclude и search.exclude.

Совет. В Проводнике вы можете щелкнуть правой кнопкой мыши папку и выбрать "Найти в папке", чтобы выполнить поиск только внутри папки.

Палитра команд

VS Code также доступен с клавиатуры. Самая важная комбинация клавиш, которую нужно знать, это kb(workbench.action.showCommands) , которая вызывает палитру команд. Отсюда у вас есть доступ ко всем функциям VS Code, включая сочетания клавиш для наиболее распространенных операций.

Палитра команд< бр />

Палитра команд обеспечивает доступ ко многим командам. Вы можете выполнять команды редактора, открывать файлы, искать символы и быстро просматривать схему файла, используя одно и то же интерактивное окно. Вот несколько советов:

  • kb(workbench.action.quickOpen) позволит вам перейти к любому файлу или символу, просто введя его имя
  • kb(workbench.action.openPreviousEditor) будет циклически просматривать последний открытый набор файлов
  • kb(workbench.action.showCommands) приведет вас прямо к командам редактора
  • kb(workbench.action.gotoSymbol) позволит вам перейти к определенному символу в файле
  • kb(workbench.action.gotoLine) позволит вам перейти к определенной строке в файле

Быстрая открытая справка

Быстрая навигация по файлам

Проводник отлично подходит для навигации между файлами при изучении проекта. Однако, когда вы работаете над задачей, вы обнаружите, что быстро переключаетесь между одним и тем же набором файлов. VS Code предоставляет две мощные команды для навигации по файлам с помощью простых в использовании привязок клавиш.

Удерживайте kbstyle(Ctrl) и нажмите kbstyle(Tab), чтобы просмотреть список всех файлов, открытых с момента запуска VS Code. Чтобы открыть один из этих файлов, снова используйте kbstyle(Tab), чтобы выбрать файл, к которому вы хотите перейти, затем отпустите kbstyle(Ctrl), чтобы открыть его.

Быстрая навигация< бр />

В качестве альтернативы вы можете использовать kb(workbench.action.navigationBack) и kb(workbench.action.navigateForward) для навигации между файлами и местами редактирования. Если вы перемещаетесь между разными строками одного и того же файла, эти ярлыки позволяют легко перемещаться между этими местами.

Совет. Вы можете открыть любой файл по его имени, набрав kb(workbench.action.quickOpen) (Быстрое открытие).

Поддержка кодировки файлов

Установите кодировку файла глобально или для каждой рабочей области с помощью параметра files.encoding в настройках пользователя или в настройках рабочей области.

files.encodingsetting

Вы можете просмотреть кодировку файла в строке состояния.

Кодировка в строке состояния

Нажмите на кодировку в строке состояния, чтобы снова открыть или сохранить активный файл с другой кодировкой.

Повторно откройте или сохраните с другим кодировка

Затем выберите кодировку.

Выберите кодировку

Запуск из командной строки

Вы можете запустить VS Code из командной строки, чтобы быстро открыть файл, папку или проект. Обычно вы открываете VS Code в контексте папки. Мы считаем, что лучший способ сделать это — просто ввести:

Совет. В нашем разделе по установке есть инструкции для пользователей Mac, которые позволяют запускать VS Code из терминала. Мы автоматически добавляем исполняемый файл VS Code в переменную среды PATH в Windows и Linux.

Иногда вам может понадобиться открыть или создать файл. Если файл не существует, мы создадим его для вас:

Совет. У вас может быть сколько угодно имен файлов, разделенных пробелами.

Дополнительные аргументы командной строки

Вот необязательные аргументы командной строки, которые вы можете использовать при запуске VS Code из командной строки через код:

И для файлов, и для папок можно использовать абсолютные или относительные пути. Относительные пути относятся к текущему каталогу командной строки, в котором вы запускаете код.

Если вы укажете более одного файла или папки в командной строке, VS Code откроет только один экземпляр.

Открытие проекта

Чтобы открыть проект, содержащийся в папке C:\src\WebApp , вы должны запустить VS Code следующим образом:

После открытия VS Code просто откройте исходные файлы и используйте строку состояния для переключения активного проекта по мере необходимости.

Строка состояния< бр />

Управление окнами

В VS Code есть несколько параметров для управления открытием или восстановлением окон между сеансами.

Настройка window.openFilesInNewWindow определяет, должны ли файлы открываться в новом окне вместо повторного использования существующего экземпляра VS Code. По умолчанию VS Code открывает новое окно, когда вы дважды щелкаете файл вне VS Code или открываете файл из командной строки. Установите для этого параметра значение false, чтобы повторно использовать последний активный экземпляр VS Code и открывать в нем файлы.

Настройка window.reopenFolders указывает VS Code, как восстановить открытые окна предыдущего сеанса. По умолчанию VS Code повторно открывает последнюю открытую папку, с которой вы работали (настройка: one ). Измените этот параметр на none, чтобы никогда не открывать папки повторно и всегда начинать с пустого экземпляра VS Code. Измените его на все, чтобы восстановить все папки, с которыми вы работали во время предыдущего сеанса.

Дальнейшие шаги

Вы рассмотрели базовый пользовательский интерфейс — в VS Code есть еще много чего. Читайте дальше, чтобы узнать о:

    - Узнайте, как настроить VS Code в соответствии с вашими предпочтениями с помощью настроек пользователя и рабочей области. - Lint, IntelliSense, лампочки, определение Peek and Goto и многое другое - Вот где VS Code действительно сияет - Темы, настройки и привязки клавиатуры

Часто задаваемые вопросы

В: Возможен ли глобальный поиск и замена?

О: Эта функция еще не реализована, но вы можете ожидать, что она появится в будущем!

В: Как включить перенос слов?

A: Вы можете управлять переносом слов с помощью параметра editor.wrappingColumn. По умолчанию для editor.wrappingColumn установлено значение 300 символов. Вы можете отрегулировать ширину столбца или установить значение равным нулю, чтобы обернуть ширину области просмотра редактора:

Вы можете включить перенос слов для сеанса VS Code с помощью kb(editor.action.toggleWordWrap) . При перезапуске VS Code будет выбрано сохраненное значение editor.wrappingColumn.

В: Как показать больше файлов в разделе РАБОЧИЕ ФАЙЛЫ?

Когда я редактирую файлы в Visual Studio Code, я ожидаю, что файлы будут сохранены по мере их редактирования. Однако, когда я пытаюсь загрузить файлы на сервер, я обнаруживаю, что в файле, который я обновил, нет изменений. Только после закрытия Visual Studio Code я вижу обновленные файлы.

Версия кода VS: код 1.46.0 (a5d1cc2, 2020-06-10T09:03:20.462Z)
Версия ОС: Windows_NT x64 10.0.19041

Текст был успешно обновлен, но возникли следующие ошибки:

Проблема требует дополнительной информации от плаката

Проблема требует дополнительной информации от постера (с комментарием бота)

MarcMenzel прокомментировал 18 июня 2020 г.

Чтобы воспроизвести проблему, попробуйте сохранить html-файл в Visual Studio Code и проверить Windows или проводник, чтобы узнать, изменилось ли время записи файла, или попробуйте просмотреть html-файл в браузере, чтобы увидеть, есть ли какие-либо изменения после изменив его в Visual Studio Code, если в файле нет никаких изменений, попробуйте закрыть Visual Studio Code, а затем проверить, есть ли какие-либо изменения после выхода из Visual Studio Code.

MarcMenzel прокомментировал 18 июня 2020 г.

Я внес изменения в html-файлы в Visual Studio Code, установив для автосохранения значение afterDelay. Проблема в том, что когда я просматриваю html-файл в браузере, я не вижу никаких изменений. Если я открою Блокнот для редактирования html-файла, а затем сохраню его в Блокноте, я увижу внесенные изменения при просмотре html-файла в браузере. Я просмотрел HTML-файл в новом браузере Microsoft Edge.

bpasero прокомментировал 18 июня 2020 г.

Чтобы воспроизвести проблему, попробуйте сохранить html-файл в Visual Studio Code и проверить Windows или проводник, чтобы узнать, изменилось ли время записи файла, или попробуйте просмотреть html-файл в браузере, чтобы увидеть, есть ли любые изменения после его изменения в коде Visual Studio

Похоже, что это очень простая вещь, и если она не работает, ни один пользователь не сможет использовать VSCode для сохранения файлов, согласитесь. Таким образом, согласны ли вы, что это может быть связано с вашей настройкой, а не с VSCode? Как выглядит ваша установка.

MarcMenzel прокомментировал 18 июня 2020 г.

Я использую версию VS Code: код 1.46.0 в Windows_NT x64 10.0.19041 (в основном Windows 10 Profession Edition версии 2004. Я не уверен, проблема на моей стороне или нет. Мне придется изучить ее .

bpasero прокомментировал 18 июня 2020 г.

MarcMenzel прокомментировал 18 июня 2020 г.

Если это на моей стороне, в чем может быть проблема?

bpasero прокомментировал 18 июня 2020 г.

Это локальная файловая система или удаленная? Это происходит с каждой папкой или только с определенной? Вы используете OneDrive или что-то другое?

MarcMenzel прокомментировал 18 июня 2020 г.

Это локальная система.

MarcMenzel прокомментировал 18 июня 2020 г.

Я не использую OneDrive для редактируемых HTML-файлов. Это случалось и раньше с другими папками.

MarcMenzel прокомментировал 18 июня 2020 г.

Интересно, связано ли это с "EBADF: неверный файловый дескриптор, fdatasync". Я не уверен, что это такое. Я видел это в другом отчете о проблеме GitHub. форма почти двухлетней давности. Всего день или два назад все работало.

bpasero прокомментировал 18 июня 2020 г.

@MarcMenzel да, эта ошибка звучит подозрительно и может указывать на проблемы в файловой системе или на жестком диске. Мы пытаемся выполнить fdatasync только один раз, а затем сдаемся. Возможно, ваш диск поврежден?

MarcMenzel прокомментировал 18 июня 2020 г.

Я не уверен.

прокомментировал provks 22 июня 2020 г.

Тип проблемы: ошибка

Здравствуйте, проблема такая же, файл не сохранен, пользовательский интерфейс в порядке, он показывает, что файл сохранен. Хотя я включил автосохранение файлов. Но журналы терминала показывают, что вместо обновленного кода JS выполняется старый.

Чтобы сохранить файлы. Мне нужно закрыть VS Code и открыть его снова. Я использую Убунту 20.04. Поскольку я все еще изучаю Nodejs, мне потребовалась почти неделя, чтобы наконец понять, что проблема связана с редактором, а не с моим кодом. Столкнувшись с этой проблемой с момента последнего обновления VS Code. Более подробная информация прилагается ниже. Я установил VS Code из магазина моментальных снимков.

Версия: 1.46.1
Коммит: cd9ea64
Дата: 2020-06-17T21:13:08.304Z
Электрон: 7.3.1
>Chrome: 78.0.3904.130
Node.js: 12.8.1
V8: 7.8.279.23-electron.0
ОС: Linux x64 5.4.0-37-generic snap

Версия VS Code: Code 1.46.1 (cd9ea64, 2020-06-17T21:13:08.304Z)
Версия ОС: Linux x64 5.4.0-37-generic snap< /p>

bpasero прокомментировал 22 июня 2020 г.

  • открыть файл
  • внести изменения в VSCode
  • Файл > Сохранить
  • открыть терминал
  • бегите меньше

И содержимое, которое печатается, не соответствует изменениям, которые вы сделали в VSCode, пока вы не закроете VSCode?

прокомментировал provks 22 июня 2020 г.

@bpasero Да, именно это и происходит. Но это решается, как только я перезапускаю VSCode.Иногда мне также приходится перезагружать систему, чтобы решить эту проблему.

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

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

Шаг 1. Включите автосохранение в Visual Studio Code

1) Сначала откройте код Visual Studio и откройте настройки, нажав «Ctrl+,», если вы используете компьютер с Windows, или нажмите «Cmd+,», если вы работаете на компьютере Mac.

Окно настроек кода Visual Studio

2) Теперь в строке поиска введите «автосохранение» и в списке «Файлы: автосохранение» выберите параметр «afterdelay». .

Красная стрелка указывает на задержку в коде Visual Studio

3) После этого в списке « Файлы: задержка автосохранения » установите желаемое время задержки в миллисекундах, после чего код Visual Studio автоматически сохранит изменения в файле. В нашем случае это "1000" .

Красная стрелка указывает на таймер Afterdelay в коде Visual Studio

И все готово 👍👍, теперь код Visual Studio автоматически сохранит изменения для вас. Теперь вы можете успешно включить автосохранение в коде Visual Studio.

Дополнительную информацию о функции автосохранения в коде Visual Studio см. в этой статье Microsoft "Основное редактирование в коде Visual Studio".

Читайте также: