MEAN stack and bootstrap / bower issue

Question

I'm currently exploring new ways to develop and have come across the MEAN stack, which can be found here - http://mean.io/#!/

I have installed Mongo, Node (plus npm etc...) and gone through all the steps stated on the website. The issue comes when I execute grunt (or even node server.js) and open the webpage - terminal displays the following:

Error: ENOENT, open '/Users/xxx/myApp/bower_components/bootstrap/dist/css/bootstrap.css'

First problem is, bower_components directory doesn't actually exist! I'm assuming this is probably the first point of call, however I'm not totally sure where to start in troubleshooting this (I'm new to bower).

Does anyone have any experience with MEAN stack and/or how to resolve the issue with bootstrap / bower_components directory?

Any help would be appreciated.

Thanks in advance :)

Answer 1

It sounds like you haven't installed bower, and as a result of that not installed bootstrap through bower.

Install Bower

$ npm install -g bower

Install bootstrap via bower

$ bower install bootstrap

You can read more about it their website. And also search for bower packages here. Since you're using angular you might wanna download angular-bootstrap as well.

UPDATE

What bower provides is a package manager for client-side modules. Similar to npm, with the difference that npm also provides backend-/nodejs-modules.

If you're using mean.io your project will be prepared with a file called bower.json and another one called package.json which specifies the dependencies in your project. To install these, start off by getting your node.js dependencies:

$ npm install

If you want bower to be installed globally, use:

$ npm install -g bower

Then install your bower dependencies

$ bower install

And now you should be good to go.

You can also add bower manually

or if you want to create your mean project from scratch

Install Bower

$ npm install -g bower

Install bootstrap via bower

$ bower install bootstrap

Save your dependencies

If you want to create bower.json to save your dependencies:

$ bower init 

and follow the instructions provided in the console.

Now when you install new bower packages you use --save and bower will add the dependency to your bower.json.

$ bower install bootstrap --save