Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Usando o Bower

Nando Vieira
September 14, 2013

Usando o Bower

Como você lida com as dependências de seu frontend? Se você não faz isso de uma maneira automatizada, está perdendo tempo. Veja como o Bower pode ajudá-lo a manter as dependências de interface sobre controle sem muito esforço.

Palestra apresentada no 31º GURU-SP - 14/09/2013

Nando Vieira

September 14, 2013
Tweet

More Decks by Nando Vieira

Other Decks in Programming

Transcript

  1. A packa e mana er for the web Bower Bower

    Bower A packa e mana er for the web
  2. $ bower search jquery Search results: jquery git://github.com/components/jquery.git jquery-ui git://github.com/components/jqueryui

    jquery.cookie git://github.com/carhartl/jquery-cookie.git jquery-file-upload git://github.com/blueimp/jQuery-File-Upload.git ...
  3. $ bower install jquery bower cached git://github.com/components/jquery.git#2.0.3 bower validate 2.0.3

    against git://github.com/components/jquery.git#* bower install jquery#2.0.3 jquery#2.0.3 app/bower_components/jquery
  4. Você pode instalar uma versão específica. Você pode instalar um

    repositório it. Você pode instalar um commit. Você pode instalar um ta . Você pode instalar uma url. Você pode instalar um diretório local.
  5. $ bower install jquery#1.10.3 $ bower install https://github.com/fnando/module.git $ bower

    install https://github.com/fnando/module#518331e... $ bower install http://code.jquery.com/jquery-latest.min.js $ bower install ~/Projects/module.js
  6. $ bower init [?] name: howto [?] version: 0.0.0 [?]

    description: [?] 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 {...} [?] Looks good? Yes
  7. { "name": "howto", "version": "0.0.0", "license": "MIT", "private": true, "ignore":

    [ "**/.*", "node_modules", "bower_components", "test", "tests" ] }
  8. jquery-rails jquery-ui-rails twitter-bootstrap-rails less-rails-bootstrap chosen-rails font-awesome- sassrails modernizr-rails select2-rails fancybox-rails

    underscore-rails bootstrap-sass-rails requirejs-rails facebox-rails formalize-rails momentjs-rails zero-clipboard-rails skeleton-rails mini-bootstrap-rails html5shiv-rails zepto-rails bootstrap-tooltip-rails kube-rails
  9. O asset pipeline irá se encarre ar de expandir a

    sua dependência corretamente.