How to change bower's default components folder?

node.jsBower

node.js Problem Overview


I'm making a new project that uses bower from twitter. I created a component.json to maintain all my dependency like jquery. Then I run bower install that installs everything in a folder named components. But I need to install the components in a different folder, e.g. public/components.

I have tried editing my components.json into:

{
  "name": "test",
  "version": "1.0.0",
  "directory": "public/",
  "dependencies": {
    "jquery": "*"
  }
}

or:

{
  "name": "test",
  "version": "1.0.0",
  "componentsDirectory": "public/",
  "dependencies": {
    "jquery": "*"
  }
}

as shown in https://github.com/twitter/bower/pull/94 but it doesn't work.

node.js Solutions


Solution 1 - node.js

Create a Bower configuration file .bowerrc in the project root (as opposed to your home directory) with the content:

{
  "directory" : "public/components"
}

Run bower install again.

Solution 2 - node.js

In addition to editing .bowerrc to setup your default install path, you can also setup custom install paths for different file types.

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"
      ]
    }
  }
}

Run the following command: bower-installer

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

Solution 3 - node.js

I had the same issue on my windows 10. This is what fixed my problem

  1. Delete bower_components in your root folder
  2. Create a .bowerrc file in the root
  3. In the file write this code {"directory" : "public/bower_components"}
  4. Run a bower install

You should see bower_components folder in your public folder now

Solution 4 - node.js

Something worth mentioning...

As noted above by other contributors, using a .bowerrc file with the JSON

{ "directory": "some/path" }

is necessary -- HOWEVER, you may run into an issue on Windows while creating that file. If Windows gives you a message imploring you to add a "file name", simply use a text editor / IDE such as Notepad++.

Add the JSON to an unnamed file, save it as .bowerrc -- you're good to go!

Probably an easy assumption, but I hope this save others the unnecessary headache :)

Solution 5 - node.js

Try putting the components.json file in the public directory of your application, rather than the root directory, then re-run bower install ...try this in your app home directory:

cp components.json public
cd public
bower install

Solution 6 - node.js

Hi i am same problem and resolve this ways.

windows user and vs cant'create .bowerrc file.

in cmd go any folder

install any packages which is contains .bowerrc file forexample

bower install angular-local-storage

this plugin contains .bowerrc file. copy that and go to your project and paste this file.

and in visual studio - solution explorer - show all files and include project seen .bowerrc file

i resolve this ways :)

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAdam RamadhanView Question on Stackoverflow
Solution 1 - node.jsAdam RamadhanView Answer on Stackoverflow
Solution 2 - node.jslfender6445View Answer on Stackoverflow
Solution 3 - node.jsTim AnishereView Answer on Stackoverflow
Solution 4 - node.jsCodyView Answer on Stackoverflow
Solution 5 - node.jshagopeView Answer on Stackoverflow
Solution 6 - node.jsAbdullah SARGINView Answer on Stackoverflow