Як створити шаблони проектів та розширення для Visual Studio 2019

Привіт!

Нещодавно я створив два шаблони проектів для Vue JS + Asp.Net Core, обидва вони як розширення Visual Studio 2019. Їх поділили на ринку Visual Studio, як ви можете побачити за посиланням нижче:

  • Шаблон Vue JS + Asp.Net Core 3.1

Хочете знати, як створити власне розширення та опублікувати власний шаблон? Якщо так, решта статті - це покроковий процес щодо того, як це зробити.

Створення проекту

Перше, що вам потрібно зробити, це створити проект, яким ви хочете поділитися як шаблон. У цій статті я продемонструю крок за кроком за допомогою проекту Vue JS + Asp.Net Core, який я вже опублікував.

Експорт проекту

Після створення проекту в Visual Studio 2019 перейдіть до меню меню Project і виберіть опцію "Експорт шаблону":

Існує два типи шаблонів: Шаблон проекту та Шаблон предмета. Як у нашому випадку ми створюємо шаблон проекту, я вибрав базовий варіант:

Наступним кроком є ​​налаштування імені, опису, піктограми, яка буде показана користувачам, та попереднього перегляду зображення. Дійсно важливо правильно встановити цю інформацію настільки високо, наскільки ви можете, тому що вона з’явиться кінцевим користувачам, які завантажують та встановлюють ваш шаблон / розширення.

І зніміть прапорець "Автоматично імпортувати до Visual Studio". Таким чином ви зможете встановити розширення, яке ви створюєте.

Нарешті, процес створить компактну папку, яка містить сам шаблон, але це ще не кінець створення:

Визначення тегів

Коли ми створюємо новий проект на Visual Studio 2019, шаблони з'являються разом із деякими конкретними тегами, які допомагають нам фільтрувати шаблони:

Оскільки остання версія Visual Studio 2019, ці теги є обов'язковими для тих, хто хоче опублікувати розширення. Без них розширення буде встановлено, але шаблон ніколи не відображатиметься у списку, навіть якщо користувач його шукає.

Щоб створити ці теги, відкрийте компактну папку, що була створена за допомогою шаблону на останньому кроці та відкрийте .vstemplate файл за допомогою редактора тексту:

У розділі "Дані шаблону" додайте після тегу "ProvideDefaultName" посилання на список тегів до вашого шаблону, наприклад платформи, типу проекту, мови тощо. У моєму випадку я вказав наступне:

Повний доступний список тегів можна знайти за посиланням нижче:

Створення розширення

Із уже створеним шаблоном і встановленими тегами, тепер настав час створити інсталяційний файл для розширення.

Для цього просто створіть проект типу VSIX Project:

Це основна структура проекту:

PS: однак я створив назву проекту, використовуючи певні спеціальні символи як "+", тільки для навчальних цілей, будь ласка, уникайте цього робити в реальних сценаріях. Краще створювати без порожніх пробілів або спеціальних символів, наприклад: TemplateVueJSAspNetCoreArtigoMedium, замість імені, яку я ставив. Це запобіжить проблемам побудови, оскільки VS автоматично генерує простори імен та класи, використовуючи це ім'я.

Включіть у корінь компактну посилання на ваш шаблон. Важливо, щоб у компактній папці містилися зміни файлу .vstemplate з тегами, про які я згадував раніше. Не забувайте цього.

Цей проект має файл маніфесту, який буде містити інформацію про розширення та інструкції з встановлення.

Якщо ви двічі клацніть у цьому файлі, він буде відкритим як форма, яку ви можете заповнити полем за полем.

Ретельно змініть усю необхідну інформацію з якістю, оскільки вона з’явиться кінцевому користувачеві і в інсталяції, і на ринку. Крім того, необхідно правильно вказати поле "Автор", оскільки воно, як правило, має ім'я LAPTOP.

Після цього натисніть на "Активи":

Видаліть наявні активи, якщо вони є, і натисніть «Нове»:

Виберіть параметри, які я вставлю, і в конфігурації вкажіть компактну папку, яку ви додали до проекту.

Покоління

Щоб створити інсталяційний файл, це просто побудова проекту у режимі випуску. Він створить файл .exe, який використовується для встановлення розширення на VS.

Готово! Наше розширення було створено. Ви можете протестувати його зараз, перед публікацією на ринку Visual Studio, щоб перевірити, чи все працює добре.

Visual Studio Market Publish

Якщо ви хочете опублікувати розширення для громадськості, ви можете зробити це на Visual Studio Marketplace.

Для цього перейдіть на marketplace.visualstudio.com і після входу в систему за допомогою свого облікового запису Microsoft перейдіть до наведених нижче варіантів:

Завантажте .exe свого розширення:

Заповніть форму шаблоном та інформацією про розширення. Оскільки ця інформація буде публічною, зверніть увагу детально.

Після завершення процесу просто збережіть і чекайте процесу затвердження. Це може зайняти кілька хвилин.

Висновок

Сподіваюся, ця стаття допомогла вам. Дякую, що прочитали його.

Нижче мої профілі соціальних медіа. Не соромтеся підключитися і задайте питання. У цих профілях я часто ділюся вмістом про Веб-технології та ІТ-події.

Twitter: https://twitter.com/alemalavasi Linkedin: https://www.linkedin.com/in/alexandremalavasi/

Нещодавно я також створив канал Youtube для того, щоб сприяти технічному співтовариству, використовуючи цю платформу, зосередившись на .NET Core, Vue JS, Azure тощо. Якщо вас цікавлять ці теми, рекомендую підписатися. Незабаром буде випущений контент регулярно, тоді як я налаштовую аудіо, відео та вміст, щоб забезпечити вам якісне враження.

Посилання: https://www.youtube.com/channel/UC-KFGgYiot1eA8QFqIgLmqA