Создание темы — самое интересное. После того, как вы закончите, следующим шагом будет публикация вашей темы, чтобы вы и другие могли наслаждаться своим творением!
Вы могли бы подумать, что публикация расширения VS Code будет простым процессом, но это не так. (Возможно, я привык легко публиковать пакеты npm и воспринимать реестры как нечто само собой разумеющееся.)
В любом случае вам нужно опубликовать свою тему в двух местах:
- Visual Studio Marketplace для пользователей VS Code
- Откройте VSX в других текстовых редакторах
Возможно, вы захотите опубликовать в npm, чтобы другие могли легко использовать вашу тему для других контекстов, например для подсветки синтаксиса через Shiki.
Ваша тема готовится
Когда вы называете свою тему, вы не можете поместить ее в такую область видимости. @scope/theme-name. Это предотвратит публикацию в Open VSX.
Итак, убедитесь, что имя вашей темы не ограничено. ( theme Это слово необязательно):
{
"name": "twilight-cosmos-theme",
}Чтобы включить значок в вашу тему, вам понадобится 128px Квадратный файл изображения, доступный в вашем проекте. положи это icon Свойство, указывающее на файл:
{
"icon": "path/to/icon.png",
}Далее вам нужно убедиться, что у вас есть contributes ключ внутри тебя package.json файл. VS Code и другие текстовые редакторы ищут по нему темы.
{
"contributes": {
"themes": [
{
"label": "",
"uiTheme": "vs-dark",
"path": "./.json"
}
]
},
} Наконец, вам нужно будет включить несколько ключевых слов, чтобы ваша тема была доступна для поиска как на VS Marketplace, так и на Open VSX.
Если у вас с этим возникли проблемы, дайте ИИ файл вашей темы и попросите его сгенерировать для вас ключевые слова 😉
{
"keywords": [
"theme",
"dark theme",
"twilight",
"cosmos",
"color-theme",
"dark",
"purple",
"blue",
"vscode-theme"
],
}Публикация в Visual Studio Marketplace
Microsoft позволяет публиковать в Visual Studio Marketplace vsce Если у вас есть личный токен доступа из учетной записи Azure DevOps.
К сожалению, при написании этой статьи я столкнулся с несколькими проблемами при настройке учетной записи Azure Devops, поэтому мне пришлось опубликовать свое расширение вручную.
Здесь я расскажу об обоих маршрутах.
Перед публикацией вам необходимо иметь учетную запись Visual Studio Marketplace. Итак, подпишитесь на него, если у вас его еще нет.
Затем сделайте следующее:
- нажмите на опубликовать расширение.
- Создайте учетную запись издателя.
Этот шаг необходим для публикации через оба vsce И ручной маршрут.
Публикация через VSCE
Чтобы это работало, вам понадобится учетная запись Azure DevOps. Когда он у вас есть, вы можете создать токен личного доступа, выполнив следующие действия.
Примечание. Немного раздражает тот факт, что вы не можете получить пожизненный токен доступа с помощью Azure DevOps. Максимальный срок годности наступает примерно через год.
Также обратите внимание: когда я попробовал это сделать, у меня возникли огромные проблемы с созданием учетной записи Azure DevOps — последняя часть продолжала зависать, и я не мог перейти на нужную страницу, даже когда скопировал URL-адрес! В любом случае, если это произойдет с вами, не паникуйте. Возможно, вам придется подождать 1–2 дня, прежде чем повторить попытку. В конце концов это сработает.
Если у вас есть личный токен доступа, остальные шаги довольно просты.
Сначала войдите в VSCE, используя свой идентификатор издателя, который вы создали в Visual Studio Marketplace. (Введите идентификатор издателя, а не идентификатор пользователя!).
npx vsce login Когда он попросит вас ввести токен доступа. Затем выполните следующую команду для публикации на рынке:
npx vsce publishи все готово!
публикация вручную
Если у вас есть проблемы с токенами личного доступа, как у меня, вам придется пойти по этому пути. К счастью, это тоже довольно просто. Вы можете зайти на Visual Studio Marketplace и сделать следующее:
- нажмите на опубликовать расширение.
- Нажмите новое расширение.
- Использовать
vsce packageЗакажите расширения в упаковкеvisxфайл. - перетащить упакованный
visxФайл для загрузки вашего расширения.
Вот и все!
Проверка кода Visual Studio
Если это ваше первое расширение, вы можете пройти «проверку» на Visual Studio Marketplace только в том случае, если вашему расширению исполнилось не менее шести месяцев. Итак, если вы хотите пройти проверку, установите напоминание через шесть месяцев и посетите эту страницу для получения более подробной информации.
Публикация в Open VSX
Благодаря облаку я понял, что VS Code использует Visual Studio Marketplace, но другие текстовые редакторы, например Cursor, используют Open VSX.
Публикация в Open VSX немного сложнее. Вы должны:
- Войдите, чтобы открыть VSX через GitHub.
- Создать учетную запись Eclipse Foundation
- Свяжите свой репозиторий GitHub со своей учетной записью Eclipse Foundation.
- Подпишите их соглашение.
- Создайте пространство имен издателя и добавьте его как
publisherв твоемpackage.jsonфайл. - Создайте токен доступа.
- Затем, наконец, бегите
npx ovsx publishЧтобы опубликовать свой пакет.
таким же образом, ovsx При первой попытке публикации вам будет предложено ввести токен личного доступа. к счастью, ovsx Похоже, у него есть пожизненный токен доступа, поэтому нам не нужно беспокоиться об истечении его срока действия.
заявка на пространство имен издателя
По сути, это «проверка» с помощью OpenVSX, но OpenVSX называет это «заявлением» пространства имен издателя для проверки. Не уделяя слишком много внимания языку: этот процесс требует некоторых усилий, но его можно выполнить сейчас (а не через шесть месяцев).
После создания пространства имен издателя вы увидите четкое предупреждение:
Чтобы заявить права на пространство имен издателя, вам необходимо создать задачу GitHub с Eclipse Foundation и указать, что вы хотите заявить права на пространство имен.
В этом выпуске:
- Включите свой репозиторий GitHub (если вы сделаете его общедоступным).
- Предложите предоставить временный доступ к вашему репозиторию GitHub (если он частный).
А обо всем остальном кто-то позаботится.
Команда Eclipse Foundation, кажется, очень отзывчива, поэтому я бы не беспокоился о сбое связи.
Изображения включены в вашу тему
Имеет смысл включать изображения, чтобы продемонстрировать вашу тему. Readme.md файл. Это позволит пользователям понять цвета вашей темы, прежде чем решить, хотят ли они ее загружать или нет.
К сожалению, как VS Marketplace, так и Open VSX не позволяют использовать относительные URL-адреса — изображения будут повреждены, если вы используете относительные ссылки из своего репозитория, — поэтому вместо этого вам придется ссылаться на абсолютный URL-адрес.
Лучшее место для ссылки — репозиторий GitHub, если он открыт для общего доступа.
URL-адрес будет примерно таким:
 подведение итогов
Публикация вашей первой темы редактора VS Code может оказаться сложной задачей. Но не позволяйте этому процессу помешать вам – и другим – наслаждаться вашей темой!
Если вам интересно, моя первая тема называется «Сумеречный космос». Более подробную информацию о процессе изготовления вы можете найти в моей предыдущей статье.
Наслаждайтесь (несколько разочаровывающим) процессом! Ты преодолеешь это прежде, чем узнаешь об этом.
