Saltar para o conteúdo

Bower

Fonte: Wikiversidade


Durante o processo de desenvolvimento de software um recorrente problema é o gerenciamento de dependências, pois é comum se ter a evolução de bibliotecas. Para que esse controle de não seja feito de forma arbitrária por cada desenvolvedor, é necessário ter um controle sobre, daí a criação de vários gerenciadores de pacotes. O presente artigo mencionará o Bower, um gerenciador de pacotes de front-end.

Gerenciamento de pacotes

[editar | editar código-fonte]

Pacotes são arquivos compactados que contém todos os arquivos necessários para a instalação e configuração de um software. Tal formato facilita a instalação e desinstalação das mais diversas aplicações disponíveis para os sistemas operacionais. No Linux, os principais tipos de pacote são o .deb, .rpm e .tgz.

Gerenciadores de pacotes

[editar | editar código-fonte]

Gerenciadores de pacotes facilitam a instalação de pacotes. Por meio deles, pacotes são instalados e removidos. Além disso, muitos pacotes possuem dependências, isto é, precisam de outros pacotes instalados para funcionarem. Os gerenciadores de pacotes instalam as dependências necessárias automaticamente, além de evitar reinstalação de dependências previamente instaladas, algo que poderia acontecer se as dependências fossem instaladas manualmente. No Linux, os principais gerenciadores de pacotes são o DPKG (para formato .deb), o RPM (para formato .rpm) e o TGZ (para formato .tgz).

Gerenciadores de pacotes podem gerenciar pacotes dos mais diversos tipos. A Steam (plataforma de jogos da Valve), por exemplo, é um gerenciador de pacotes, distribuindo jogos em pacotes binários. A Google Play também é considerada um gerenciador de pacotes por disponibilizar aplicativos e instalá-los em formato .apk em dispositivos Android. O Bower é um gerenciador de pacotes para desenvolvimento web focado em ferramentas de front-end como HTML, CSS e Javascript.

Sobre o Bower

[editar | editar código-fonte]

O Bower é um popular gerenciador de pacotes projetado para gerenciar especialmente dependências do frontend, como projetos CSS, Javascript, etc. Ele foi inicialmente desenvolvido no Twitter por Jacob Thornton, co-criador do Framework Twitter Bootstrap.

O Bower possui um uso simples o suficiente para não atrapalhar, mas sim ajudar o dia-a-dia do desenvolvedor front-end. Dentre suas funcionalidades, estão:

  • Fazer buscas no repositório do Bower por nome;
  • Instalação de pacotes e suas devidas dependências;
  • Salvamento das versões das dependências instaladas para posterior reinstalação;
  • Salvamento de um cache em seu computador para acelerar a instalação de uma determinada dependência em mais de um projeto;
  • Aviso sobre incompatibilidade entre duas ou mais dependências de um projeto que dependem de um único projeto, mas em versões diferentes.

Por ser um gerenciador de pacotes, caso você queira usar algo que tenha dependência de outros pacotes, todas as dependências necessárias já serão baixadas automaticamente. Algumas outras vantagens desse gerenciador de pacotes podem ser citadas:

  • Simplifica o que poderia ser chamado de gerenciamento de dependência declarativa, ou seja, você declara suas dependências no arquivo bower.json para que outras coisas possam determiná-las facilmente;
  • Não é necessário commitar dependências para o controle de versão.
  • A versão semântica é usada para ajudar a definir um intervalo de versões aceitáveis para uma dependência, o que facilita a atualização para versões mais recentes dentro do intervalo definido;
  • Fácil de usar compilações diferentes de uma dependência para dev vs. prod;
  • Você pode distribuir o arquivo bower.json e todos podem se atualizar com um simples bower install.

Instalando dependências

[editar | editar código-fonte]

O Bower tem como dependência o Node.js, o npm (gerenciador de pacotes para javascript) e o git.

Para instalar o Node.js, o npm e o git no Linux, utilize os seguintes comandos:

$ pacman -S git
$ pacman -S nodejs npm

Debian, Ubuntu e derivados

[editar | editar código-fonte]
$ sudo apt-get install git
$ sudo apt-get install nodejs npm

Para Fedora <= 21:

$ sudo yum install git
$ sudo yum install nodejs 
$ sudo yum install npm

Para Fedora >= 22:

$ sudo dnf install git
$ sudo dnf install nodejs 
$ sudo dnf install npm

Instalando Bower

[editar | editar código-fonte]

Após a instalação de todas as dependências, o Bower pode ser facilmente instalado por meio do npm:

$ npm install -g bower

Pronto! O Bower está pronto para uso. Importante ressaltar que a opção -g instala o Bower globalmente na máquina, permitindo que seja usado facilmente em outros projetos.

Utilizando Bower

[editar | editar código-fonte]

Para começar a utilizar o Bower depois de sua instalação basta executar o comando bower init. Você precisará responder diversas perguntas e, ao final, terá um arquivo de configuração chamado bower.json.

$ bower init
? name: sample
? version: 0.0.1
? description: sample bower
? main file:
? keywords:
? authors: 
? license: MIT
? homepage: 
? set currently installed components as dependencies? Yes
? add commonly ignored files to ignore list? Yes
? would you like to mark this package as private which
    prevents it from being accidentally published to the registry? Yes

Abaixo é visto o bower.json gerado.

{
  "name": "sample",
  "version": "0.0.1",
  "license": "MIT",
  "private": true,
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ]
}


Com o arquivo de configuração gerado, para instalar as dependências pode-se utilizar o comando bower install.

$ bower install <package> --save

Uma flag que pode ser utilizada é a --save-dev que adicionada o pacote a lista devDependencies.

Para atualizar todas as dependências instaladas, execute o comando bower update. Se quiser atualizar apenas uma biblioteca, é possível passar o nome.

$ bower update <package>

Para remover as dependências, utilize o comando bower uninstall.

$ bower uninstall <package>

Você pode pode pesquisar os pacotes disponíveis no Bower através do comando bower search.

$ bower search module

Caso queira criar e disponibilizar um pacote no repositório do Bower, basta enviar o seu código-fonte para o um servidor git e registar o seu pacote. Para fazer isso, basta utilizar o comando bower register.

$ bower register mylib https://github.com/mylib/mylib.git

Ainda é possível verificar a especificação do arquivo bower.json no repositório bower/spec. Nesse repositório também é possível encontrar especificações para a configuração de variáveis do Bower para a sua execução. A única obrigatoriedade é que o pacote seja público.

Se você não quiser que o Bower coloque tudo no diretório bower_components, você pode instalar em outro lugar, adicionando um arquivo chamado .bowerrc na raiz do projeto. Para mudar o diretório para assets/components o arquivo vai ficar assim:

{
   "directory" : "assets/components"
}

Depois é só executar bower install novamente e deletar o diretório anterior.

Integrações

[editar | editar código-fonte]

O Bower pode ser usado em conjunto com diversos frameworks e tecnologias, algumas delas são:

Ruby::Bower é um empacotador Ruby para Bower, permitindo que as funcionalidades dele sejam usadas diretamente em ambiente Ruby. Para instalá-lo, siga os seguintes passos:

$ gem install ruby-bower

Após isso, é só declarar a gem no Gemfile das suas aplicações que usarão Bower:

gem 'ruby-bower'

Esse empacotador dá acesso à API do Bower em linha de comando para Ruby.

Bower on Rails

[editar | editar código-fonte]

'Bower on Rails disponibiliza rake tasks, integrando o Bower à sua aplicação Rails, para instalá-la, é necessário, além dos já instalados nodejs e npm, o nodejs-legacy, para Debia, Ubuntu e derivados, a instalação é com a seguinte linha de comando:

sudo apt-get install nodejs-legacy

Para utilizar em sua declaração, declare em seu Gemfile e execute bundle:

gem "bower-rails", "~> 0.11.0"

Django-Bower promove a integração entre o Bower e sua aplicação "Django. Para instalá-lo, utiliza-se o gerenciador de pacotes Python, o pip:

$ pip install django-bower

No arquivo de configurações settings.py, adicione django-bower em INSTALLED_APPS:

'djangobower',

Adicione staticfinder em STATICFILES_FINDERS:

'djangobower.finders.BowerFinder',

Especifique, em caminho absoluto, a components root do Bower:

BOWER_COMPONENTS_ROOT = '/PROJECT_ROOT/components/'

Dandelion é um framework Java focado em desenvolvimento web que ajuda a manipular web assets - como JS e CSS - e permite a integração do Bower em aplicações baseadas em Java. Tal integração consiste na busca automática de componentes Bower para todos os bower.json manifests, que são posteriormente convertidos para vendor bundles.