Setting up grunt, bower, angular dev tools after cloning from github

Question

I am trying to clone a project from github then set up the bower dependencies and grunt build / dev tools. When angular projects are initialy pushed to github, certain directories and files have been shed (since they are listed on the gitignore file). I am trying to figure out how to resurrect all these files necessary to locally run a project (that I find from browsing on github).

After cloning the project, I run the bower command so that it reads through bower.json:

% bower install

Then I run the grunt commands:

% npm install -g grunt-cli
% npm install grunt --save-dev

Why is the Gruntfile.js not automatically created when I run these terminal commands?

It also hangs up on an issue related to livereload but that evaporates after I run these:

% npm install --save-dev connect-livereload
% npm install

When I start a project from scratch with these yeoman and grunt commands, it automatically creates the Gruntfile.js and I can successfully get the project to auto-load in the browser:

% npm install -g generator-angular     
% yo angular
% bower install angular-ui
% npm install --save-dev connect-livereload
% npm install
% grunt test
% grunt server
% grunt

But I am trying to master the technique of cloning a project from github and then setting up the project locally. I am close but currently I am also experiencing an issue with a missing Gruntfile.js. I would be very grateful for any direction you could provide. All the best,

Ben

Answer 1

I get it working after do the following:

brew install nvm
source $(brew --prefix nvm)/nvm.sh

It will install nvm then you can controll your npm version (may you have problem with this with yo:angular project)

Then you should make sure that you are using npm 0.10

nvm install 0.10
nvm use 0.10

To avoid problems with previous npm installations cached you should use:

sudo npm -g cache clean

Now you are ready to get your yo:angular project working in your machine:

git clone <yourproject>

cd <your-project-directory>

npm install

It will install grunt and karma for you, then you should install all bower packages before start your dev server:

bower install

Then, finally, your project are done to be working so you can use:

grunt serve

:)

Answer 2

Using Yeoman

You don't need to clone the project from GitHub.

You simply need to make a new (clean) project directory.

cd /new/project/directory

(Optional) Update NPM

npm update -g npm

Install angular scaffold

npm install -g generator-angular

Run yeoman scaffold

yo angular

Fire up a server

grunt server

Start building your app, perhaps with Angular sub-generators

yo angular:controller myController
yo angular:directive myDirective
yo angular:filter myFilter
yo angular:service myService

Using bower to install front-end dependencies

Search for repos to install

bower search dep-name

or, http://sindresorhus.com/bower-components/

See what all has been installed

bower list

or, see your bower.json file

Installing dependencies

bower install dep-name

or, add it to bower.json file then simply run bower install(Preferred)

Most of all, Read Documentation

1. Yeoman Getting Started
2. Bower
3. Grunt

I would recommend reading through Yeoman first. Get the hang of it, then move on to the other docs once you need more advanced customization for your project. Generally, the Yeoman docs cover bower and grunt well as it relates to your Yeoman project.