Install Bower components into two different directories?

Question

When using CSS and JS components, is it possible, or even, does it make sense to install them to different directories?

.
|-- app
    |-- scripts
        |-- com         


        

Answer 1

Bower needs to keep track of every component you install. That would be very hard if they were split up in multiple locations. For Sass development, just put the components folder in the Sass search path.

---

There are grunt tasks that can assist you in splitting it up if you insist on doing that:

(though not recommended)

• grunt-bower-task
• grunt-bower-organiser
• grunt-bower

Answer 2

There is a node package called bower-installer that provides a single command for managing alternate install paths.

run npm install -g bower-installer

Set up your bower.json

{
  "name" : "test",
  "version": "0.1",
  "dependencies" : {
    "jquery-ui" : "latest"
  },
  "install" : {
    "path" : {
      "css": "src/css",
      "js": "src/js"
    },
    "sources" : {
      "jquery-ui" : [
        "components/jquery-ui/ui/jquery-ui.custom.js",
        "components/jquery-ui/themes/start/jquery-ui.css"
      ]
    }
  }
}

Then run bower-installer command.

This will install components/jquery-ui/themes/start/jquery-ui.css to ./src/css, etc

Answer 3

Maybe You can have .bowerrc files in different directories, where you can config "directory" key to point to bower components directory.

But you will need to cd to correct directory before bower install whatever:

app/
  scripts/
    .bowerrc
  styles/
    .bowerrc
tests/
  .bowerrc