Como criar modelos de projeto e extensão para o Visual Studio 2019

Oi!

Recentemente, criei dois modelos de projeto para o Vue JS + Asp.Net Core, ambos como extensões do Visual Studio 2019. Eles foram compartilhados no mercado do Visual Studio, como você pode ver no link abaixo:

  • Template Vue JS + Asp.Net Core 3.1

Deseja saber como criar sua própria extensão e publicar seu próprio modelo? Se sim, o restante do artigo é um processo passo a passo sobre como fazer isso.

Criação de projeto

A primeira coisa que você precisa fazer é criar um projeto que você deseja compartilhar como modelo. Neste artigo, demonstrarei passo a passo usando o projeto Vue JS + Asp.Net Core que eu já publiquei.

Exportação do projeto

Depois que o projeto é criado, no Visual Studio 2019, vá para a opção de menu Projeto e escolha a opção "Exportar modelo":

Existem dois tipos de modelos: modelo de projeto e modelo de item. Como no nosso caso, estamos criando um modelo de projeto, selecionei a opção subjacente:

O próximo passo é configurar o nome, descrição, ícone que será mostrado aos usuários e a visualização da imagem. É realmente importante definir essas informações corretamente, da melhor qualidade possível, porque elas aparecerão para os usuários finais que farão o download e instalarão o seu modelo / extensão.

E desmarque a opção "Importar automaticamente para o Visual Studio". Dessa forma, você poderá instalar a extensão que está criando.

Finalmente, o processo irá gerar uma pasta compacta que contém o próprio modelo, mas não é o fim da criação:

Definição de tags

Quando criamos um novo projeto no Visual Studio 2019, os modelos aparecem junto com algumas tags específicas, que nos ajudam a filtrar os modelos:

Desde a versão mais recente do Visual Studio 2019, essas tags são obrigatórias para quem deseja publicar uma extensão. Sem esses, a extensão será instalada, mas o modelo nunca será mostrado na lista, mesmo se o usuário pesquisar isso.

Para criar essas tags, abra a pasta compacta que foi gerada com o modelo na última etapa e abra o arquivo .vstemplate usando um Editor de texto:

Na seção "Dados do modelo", adicione após a tag "ProvideDefaultName" a referência da lista de tags ao seu modelo, como plataforma, tipo de projeto, idioma etc. No meu caso, especifiquei da seguinte maneira:

A lista completa de tags disponíveis pode ser encontrada no link abaixo:

Criação da extensão

Com o modelo já criado e as tags definidas, agora é hora de criar o arquivo de instalação para a extensão.

Para isso, basta criar um projeto do tipo Projeto VSIX:

Esta é a estrutura básica do projeto:

PS: no entanto, eu criei o nome do projeto usando certos caracteres especiais como “+”, apenas para fins de ensino; evite fazer isso em cenários reais. É melhor criar sem espaços vazios ou caracteres especiais, assim: TemplateVueJSAspNetCoreArtigoMedium, em vez do nome que eu coloquei. Isso evitará problemas de compilação, porque o VS gerará automaticamente namespaces e classes usando esse nome.

Inclua na raiz a referência da pasta compacta ao seu modelo. É importante que a pasta compacta contenha as alterações do arquivo .vstemplate com as tags mencionadas anteriormente. Não esqueça disso.

Este projeto possui um arquivo de manifesto, que conterá as informações sobre as instruções de extensão e instalação.

Se você clicar duas vezes nesse arquivo, ele será aberto como um formulário, e você poderá preencher campo por campo.

Altere cuidadosamente todas as informações necessárias com qualidade, pois elas aparecerão também para o usuário final na instalação e no mercado. Além disso, é necessário especificar o campo "Autor" corretamente, pois normalmente possui o nome do PORTÁTIL.

Depois disso, clique em "Ativos":

Remova os ativos existentes, se houver, e clique em "Novo":

Escolha as opções que eu coloquei e, no caminho, especifique a pasta compacta que você adicionou ao projeto.

Geração

Para criar o arquivo de instalação, está apenas criando o projeto no modo de liberação. Ele irá gerar o arquivo .exe usado para instalar a extensão no VS.

Feito! Nossa extensão foi criada. Você pode testá-lo agora, antes de publicar no mercado do Visual Studio, para ver se tudo está funcionando bem.

Publicação do Visual Studio Market

Caso deseje publicar sua extensão ao público, você pode fazer isso no Visual Studio Marketplace.

Para fazer isso, vá para marketplace.visualstudio.com e, após fazer login com sua conta da Microsoft, vá para as opções abaixo:

Faça o upload do .exe da sua extensão:

Preencha o formulário com as informações do modelo e da extensão. Como essas informações serão públicas, preste atenção em detalhes.

Quando o processo estiver concluído, salve e aguarde o processo de aprovação. Isso pode levar alguns minutos.

Conclusão

Espero que este artigo tenha ajudado você. Obrigado por lê-lo.

Abaixo estão meus perfis de mídia social. Sinta-se à vontade para se conectar e fazer uma pergunta. Nesses perfis, compartilho frequentemente conteúdo sobre tecnologias da Web e eventos de TI.

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

Também criei recentemente um canal no Youtube para contribuir com a comunidade técnica que também usa essa plataforma, focada no .NET Core, Vue JS, Azure e muito mais. Se você estiver interessado nesses assuntos, recomendo que você se inscreva. Em breve será lançado o conteúdo regularmente, enquanto eu configuro o áudio, o vídeo e o conteúdo para proporcionar uma experiência de alta qualidade.

Link: https://www.youtube.com/channel/UC-KFGgYiot1eA8QFqIgLmqA