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

Bower on Rails

Bower on Rails

Frontend Dependency-Management in Rails

Roman Stranghöner

January 21, 2015
Tweet

More Decks by Roman Stranghöner

Other Decks in Technology

Transcript

  1. Web sites are made of lots of things – frameworks,

    libraries, assets, utilities, and rainbows. Bower manages all these things for you. —bower.io “ „
  2. init Interactively create a bower.json file search Search for a

    package by name install (--save) Install a package locally update Update a local package
  3. cache Manage bower cache help Display help information about Bower

    home Opens a package homepage info Info of a particular package link Symlink a package folder list List local packages - and possible updates lookup Look up a package URL by name prune Removes local extraneous packages register Register a package uninstall Remove a local package version Bump a package version
  4. { "name": "typeahead.js", "version": "0.10.5", "main": "dist/typeahead.bundle.js", "dependencies": { "jquery":

    ">=1.7" }, "devDependencies": { "jquery": "~1.7", "jasmine-ajax": "~1.3.1", "jasmine-jquery": "~1.5.2" } } bower.json
  5. //= require_self //= require bootstrap //= require angular //= require

    leaflet //= require_tree . //= require_tree shared application.js application.scss @import 'mixins'; @import 'reset'; @import 'bootstrap'
  6. > Node and Bower not needed > Configuration in the

    Gemfile > Most popular packages available
  7. { "lib": { "name": "bower-rails generated lib assets", "dependencies": {

    … } }, "vendor": { "name": "bower-rails generated vendor assets", "dependencies": { … } } } bower.json
  8. assets_path "assets/javascript" # Puts files under ./vendor/assets/js/bower_components group :vendor, :assets_path

    => "assets/js" do asset "jquery" asset "moment", "2.0.0" asset "secret_styles", "[email protected]:initech/secret_styles" end # Puts files under ./lib/assets/javascript/bower_components group :lib do asset "jquery" asset "backbone", "1.1.1" end Bowerfile
  9. > Ruby DSL for bower.json > Rake Tasks for Bower

    commands > Optional check-in of dependencies > Fine grained configuration
  10. > One more level of indirection > Node and npm

    dependency > Configuration fairly complicated > Relative asset paths will cause issues