Почему создается папка .vscode
В моем проекте была папка e2e , но сегодня я увидел, что папка e2e была удалена, а папка .vscode была создана в приложении Angular 4.
Каково основное использование обеих папок, можем ли мы иметь их в нашем приложении и как папка .vscode была создана в проекте и почему?
Папка .vscode содержит локальные настройки для кода Visual Studio и не используется самим angular
но я его не создавал. папка e2e была автоматически удалена и создана папка .vscode с файлом launch.json в ней. Для тестирования также используется launch.json .. ??
Папка .vscode была создана кодом Visual Studio. Я полагаю, вы изменили настройки запуска VS Code. Папка e2e не связана с .vscode, и VS Code не удалит ее автоматически.
Итак, если я создаю свой проект (папка dist с использованием ng build), а папка e2e отсутствует во время сборки, влияет ли это на приложение?
Должен ли я зафиксировать папку .vscode в системе управления исходным кодом?
Подразумевается ли папка .vscode для фиксации в системе управления исходным кодом?
В свежем проекте папка пуста, за исключением файла settings.json . Что за вещи могут попасть в эту папку? Является ли она специфичной для машины, специфичной для разработчика, как папка .vs , и поэтому не подлежит фиксации? Или эта папка должна быть общей для всех разработчиков, и поэтому она должна быть зафиксирована?
Комментарий в верхней части файла .vscode/settings.json гласит:
Это, похоже, подразумевает, что папка должна содержать специфические для проекта настройки и, следовательно, должна быть включена в исходный текст. Также, это сообщение на UserVoice, кажется, подразумевает, что некоторые типы будут помещены туда, что также предполагает, что это должно быть зафиксировано.
Проверьте в папке .vscode , хотите ли вы поделиться настройками, конфигурацией задач и конфигурацией отладки с командой. Я думаю, что обычно имеет смысл делиться настройками (например, пробелами и табуляцией) с командой, если вы хотите обеспечить соблюдение настроек в команде. Мы в команде VS Code также делимся настройками отладки и задач, потому что хотим, чтобы у нашей команды был одинаковый набор целей отладки и задач для VS Code.
Кстати, для настроек не обязательно иметь папку .vscode в проекте. Вы также можете настроить параметры на уровне пользователя.
Между commit и игнор есть третий умный вариант: покончить с `.по умолчанию суффикс.
Например, можно добавить параметры.формат JSON к .гитюдного и настройки совершать.в JSON.по умолчанию, так же, как это обычная практика (в моей команде) с `.ОКР файлы.
Как создать расширение Visual Studio Code
Visual Studio Code – это редактор кода от Microsoft, доступный для систем Windows, Linux и macOS. Для внедрения дополнительных функций он предлагает готовые расширения, которые вы можете установить через Visual Studio Code Marketplace. Но если вы не можете найти расширение, которое делает именно то, что вам нужно, вы можете создать необходимое расширение самостоятельно.
В этом руководстве вы узнаете, как создать свое первое расширение Visual Studio Code.
Требования
Для выполнения этого урока нужно:
- Загрузить и установить последнюю версию Visual Studio Code.
- Установить Node.js. Инструкции по установке зависят от дистрибутива: Mac OS, Ubuntu, CentOS, Debian.
Это руководство было проверено на версиях Node v14.4.0, npm v6.14.5, yo v3.1.1 и generator-code v1.2.16.
1: Установка инструментов
Команда Visual Studio Code разработала специальный генератор для создания расширений. Он генерирует все необходимые стартовые файлы, чтобы вы легко могли начать создание вашего расширения.
Чтобы начать разработку расширений VS Code, вам понадобятся два пакета npm:
-
– интерфейс командной строки для Yeoman. – генератор Yeoman для написания расширений Visual Studio Code.
Используйте встроенный терминал Visual Studio Code, чтобы при помощи npx запустить локальные копии yo и generator-code, а затем введите команду yo code для инициализации вашего нового проекта:
npx -p yo -p generator-code yo code
После этого Yeoman запустит генератор кода.
2: Создание расширения
Теперь вы готовы начать разработку вашего первого расширения. На вашем экране вы увидите сообщение:
Сейчас вам нужно будет ответить на несколько вопросов о проекте: указать, какое расширение вы создаете, а также выбрать между TypeScript и JavaScript. В этом уроке мы выберем JavaScript.
Затем вам будет предложено еще несколько вопросов. В этом мануале мы выбрали следующие ответы:
После завершения этого процесса вы получите все файлы, необходимые для начала работы. Два самых важных файла:
- package.json
- extension.js
Откройте package.json и взгляните на его содержимое. Вы увидите название, описание проекта и т.п. В нем есть два очень важных раздела.
- activationEvents – это список событий, которые активируют ваше расширение. Расширения загружаются по ленивой загрузке, поэтому они не активируются, пока не произойдет одно из перечисленных событий.
- commands – список команд, которые пользователи смогут запускать через ваше расширение.
Мы вернемся к ним в ближайшее время.
Вы также можете просмотреть файл extension.js. В нем мы напишем код для нашего расширения. Здесь уже есть шаблонный код, давайте разберемся с ним.
В выделенной ниже строке мы регистрируем в VS Code нашу команду. Обратите внимание, что имя helloWorld совпадает с именем команды в package.json. Это не случайно. Пакет package.json определяет, какие команды доступны пользователю, но файл extension.js регистрирует код для этой команды.
В этом примере наша команда будет только отображать на экране пользователя сообщение «Hello World».
3: Отладка расширения
Теперь, когда все необходимые файлы установлены, мы можем запустить наше расширение.
Папка .vscode – это место, где VS Code хранит конфигурационные файлы проекта. В нашем случае он включает файл launch.json, содержащий конфигурации отладки.
В этом файле проводится отладка расширения. Откройте вкладку debug в левой части экрана, а затем кликните на плей.
Это откроет новый (отладочный) экземпляр VS Code.
Открыв его, вы можете развернуть палитру команд (с помощью Command + Shift + P на Mac или Ctrl + Shift + P в Windows) и запустить Hello World.
Вы увидите всплывающее сообщение «Hello World» в правом нижнем углу.
4: Редактирование расширения
Прежде чем приступить к работе над кодом, давайте еще раз взглянем на раздел activateEvents в файле package.json. Как вы уже знаете, этот раздел содержит список событий, которые активируют наше расширение всякий раз, когда происходят. По умолчанию расширение активируется при запуске нашей команды.
Теоретически это событие может быть любым (что определяется символом *). Если установить для события активации значение *, то ваше расширение будет загружено при запуске VS Code.
Примечание: Этого делать не нужно, это просто комментарий.
Итак, у нас есть необходимые файлы и мы знаем, как их отлаживать. Приступим же к созданию нашего расширения. Предположим, мы хотим, чтобы это расширение создавало HTML-файл, который содержит шаблонный код и добавляется в наш проект.
Сначала давайте обновим название нашей команды. Откройте extension.js и обновите имя команды с extension.helloworld на extension.createBoilerplate.
Соответствующим образом обновите package.json:
Теперь напишем наш функционал. Первое, что нужно сделать, это потребовать пару пакетов. Мы будем использовать модули fs (file system) и path. В файл extension.js поместите:
Также нам нужно получить путь к текущей папке. Внутри раздела command поместите следующий фрагмент:
Нам также нужно присвоить шаблонный HTML-код переменной в файле extension.js, чтобы он автоматически записывался в файл. Вот этот шаблонный HTML:
Теперь нужно вызвать функцию writeFile модуля файловой системы и передать ее в пути к папке и HTML-коде.
Обратите внимание, мы используем модуль path, чтобы объединить путь к папке с именем файла, который мы хотим создать. Если внутри обратного вызова есть ошибка, мы отображаем ее пользователю. В противном случае расширение сообщает, что шаблонный файл успешно создан:
Вот как выглядит полный код extension.js:
Попробуйте выполнить отладку вашего нового расширения. Откройте палитру команд и запустите Create Boilerplate (помните, мы изменили имя).
После выполнения команды вы увидите только что созданный файл index.html и сообщение, которое уведомляет вас об этом:
Заключение
Чтобы узнать больше о том, какие API можно использовать и как именно их использовать, прочтите документацию по API от Visual Studio.