bower-logo

Conforme muitos já sabem, o ASP.NET Core 1.0 (inicialmente batizado como “ASP.NET 5”) traz grandes novidades no que se refere ao gerenciamento de arquivos de scripts e folhas de estilo CSS. Empregando soluções populares como Bower, npm e Gulp, a manipulação destes pacotes client-side foi automatizada a fim de simplificar o trabalho de desenvolvedores Web.

Em um artigo publicado neste blog em Setembro/2015 abordei em detalhes estas novidades:

http://netcoders.com.br/asp-net-5-integracao-bower-gulp-npm/

A adição de uma biblioteca de scripts como o AngularJS a um projeto pode ser feita incluindo uma nova referência ao arquivo bower.json (Imagem 1):

aspnetcore-clientside-01
Imagem 1. Estrutura geral de um projeto Web no ASP.NET Core 1.0

Além do nome do pacote, esta tarefa também contempla a definição de qual versão deverá ser considerada (Imagem 2):

aspnetcore-clientside-02
Imagem 2. Adicionando o AngularJS via edição do arquivo bower.json

Uma vez ajustado o arquivo bower.json, acontecerá o download automático dos itens necessários ao uso do AngularJS (como indicado na Imagem 3):

aspnetcore-clientside-03
Imagem 3. O framework AngularJS já adicionado a um projeto

A edição direta do arquivo bower.json é um dos caminhos possíveis, embora não único, para o gerenciamento de pacotes client-side em um projeto ASP.NET Core 1.0. Versões mais recentes do Visual Studio 2015 contam uma interface similar àquela do utilitário NuGet e que pode ser empregada na manipulação de bibliotecas de scripts e folhas de estilo CSS. Esta funcionalidade pode ser acessada ao se clicar com botão direito do mouse em bower.json, selecionando na sequência a opção “Manage Bower Packages…” (Imagem 4):

aspnetcore-clientside-04
Imagem 4. Acionando o gerenciador de pacotes do Bower

Aparecerá então uma tela similar à que consta na Imagem 5:

aspnetcore-clientside-05
Imagem 5. O gerenciador de pacotes do Bower

A localização e instalação de um novo pacote se dá a partir da guia “Browser”, como especificado na Imagem 6:

aspnetcore-clientside-06
Imagem 6. O gerenciador de pacotes do Bower

É possível inclusive selecionar a versão que será utilizada, comportamento este similar àquele apresentado pelo NuGet no Visual Studio 2015 (Imagem 7):

aspnetcore-clientside-07
Imagem 7. Selecionando a versão de um pacote Bower

A desinstalação de um pacote é também um processo bem simples, bastando para isto clicar com o botão direito do mouse sobre o item correspondente em Dependencies > Bower; selecionar então a opção “Uninstall Package”. É o que indica a Imagem 8.

A atualização de um package é bem parecida em relação ao procedimento de remoção, envolvendo neste caso a seleção da opção “Update Package”.

aspnetcore-clientside-08
Imagem 8. Desinstalando um pacote Bower

Concluo aqui este post, ressaltando que maiores informações sobre o ASP.NET Core 1.0 podem ser encontradas nas referências.

Espero que este conteúdo possa ter sido útil.

Até uma próxima oportunidade!

Referências

ASP.NET Core Documentation
http://docs.asp.net/en/latest/index.html

ASP.NET Core – GitHub
https://github.com/aspnet/Home

Renato Groffe

Atua como consultor em atividades voltadas ao desenvolvimento de softwares há mais de 13 anos. Bacharel em Sistemas de Informação, com especialização em Engenharia de Software. Microsoft Certified Technology Specialist (Web, WCF, Distributed Applications, ADO.NET, Windows Forms), Microsoft Specialist (HTML5 with JavaScript and CSS3, Developing ASP.NET MVC 4 Web Applications), Oracle Certified Associate (PL/SQL), Sun Certified (SCJP, SCWCD), ITIL Foundation V2, Cobit 4.1 Foundation.

Facebook Google+ 

Comentários

comentarios