I am using Visual Studio to develop my angular js application and I have run into a problem.
A package I wish to install doesn't support bower anymore, instead it uses npm. On the readme it says that I should add:
"resolvers": [
"bower-npm-resolver"
]
To the .bowerrc file, which I have done.
I have also updated my npm to the latest by running this command:
npm install -g npm
and then I did the same for bower-npm-resolver:
npm install -g bower-npm-resolver
All installed fine.
When I try to save my bower.json file, Visual Studio throws this error:
MODULE_NOT_FOUND Cannot find module 'bower-npm-resolver'
Does anyone know how I can fix this?
Related
I want to install blur admin theme with angular js
I have follow steps to install blur admin theme from below site
https://akveo.github.io/blur-admin/articles/002-installation-guidelines/
I got the error as below ,
I find for solution for that and found below commands to run
npm update
npm install gulp-sass
then again run
gulp serve
but still same error I got
In my system git is installed and my nodejs version is 8.9.4
Please help me to resolve this issue.
Seems like you have not installed gulp-sass module.
Install it by running npm following command
npm install gulp-sass#latest --save-dev
Make sure you have deleted node_modules folder before install module.
I need to setup the web server for Angular.js application using Nodejs. Accordingly I installed node.js version 6.11.0 in the path: C:\Program Files\nodejs
Next step is to install module of nodejs using the command:
npm install deployd -g
I am installing it in a path where my node_modules are installed.
When I run the command: npm install deployd –g I get one warning message (please see image for reference)
enter image description here
So I get to know that deployd is installed in the path C:\Program\node_modules\deployd.
Now if I run dpd –V command, it shows that dpd is not recognized as an internal or external command.
Can anybody please help me installing deployd?
I think this could help. It's worked for me.
npm install deployd-cli -g
This is my first time developing an AngularJS app and using the scaffolding tool Yeoman (http://yeoman.io/). I wanted to use fontawesome for some of my icons (http://fortawesome.github.io/Font-Awesome/) and I know I should use the command
bower install fontawesome
However, I also saw this article (https://www.npmjs.org/package/grunt-font-awesome-vars) that talks about npm grunt install command below
npm install grunt-font-awesome-vars --save-dev
What is the difference there? I'm still a little fuzzy on how the variety of tools work and flow together. Could any Yeoman experts give me a low down when to use bower install, npm install, and the grunt commands so I would know the differences clearly and understand the flow? Thanks.
Grunt is a task automation tool that does very little straight out of the box. It does most of its work through plugging in grunt modules that perform specific tasks.
grunt-font-awesome-vars is a module for grunt (useless without grunt)
bower is a package manager.
npm is a package manager.
(I don't use Yeoman. It's a scaffolding tool for setting up your project structure. I don't agree with its opinions on where things should go, so I don't fool with it. I configure grunt and bower manually)
Quick and dirty:
install node with npm.
Then from your console, (Developer Command Prompt for VS2013, Bash, or whatever you use)
run the following commands
npm install grunt --save
npm install bower --save
npm grunt-font-awesome-vars --save
bower doesn't need grunt. grunt doesn't need bower. grunt doesn't need grunt-font-awesome-vars but grunt-font-awesome-vars needs grunt.
With the way my work flows, I use npm to manage package dependencies that I want to automate with grunt. I use bower to manage the versions of my client dependencies.
More information:
There's a "Yo, Dawg" to describes bower that comes to mind when someone asks the difference between it and npm.
"Yo, Dawg. We heard you really like packages so we installed a
package manager inside your package manager."
Basically, bower is just another package manager. It is installed with npm (which is a separate package manager)
I use npm for managing tooling and server dependencies (like grunt, grunt modules, sass, etc...things I potentially want to be automated) and bower for functional, client specific dependencies (like angular, jquery, etc...things that I potentially want to keep up to date with current version)
Installing through bower will utilize your bower.json. Installing through npm will utilize your package.json.
npm install grunt-font-awesome-vars --save-dev
will install grunt-font-awesome-vars as well as update your package.json with a devDependency(the --save-dev flag does that) so that it is automatically installed any time you perform an
npm install
if you change that command to
npm install grunt-font-awesome-vars -g
it will install grunt-font-awesome-vars to your node install location (indicated by your PATH system variable) and be available to all node instances.
Edit to answer question from comments
Asked: Also, why is there the need to have the install command as 'grunt-font-awesome-vars -g'
grunt-font-awesome-vars is the name of a module for grunt that is deployed as a node package. You install grunt modules with the "npm install" command. -g is a flag that instructs npm to install the requested package to global space, by making it available through your PATH variable. The only things that I currently have installed globally are http-server, bower, and karma. If you don't have packages installed globally, then you will have to have performed an "npm install" of that package at the current working directory in order to execute the commands of that package. For instance, http-server is a node module and is executed command line just like any other console application. In this case, the command "http-server" will start a local http server anywhere you want to serve a site from. If I install it to my PATH, I can run http-server from anywhere I want without having to do anything special. If you don't install it to your PATH, then the http-server executable must be in the directory in which you are wanting to run it. I install it globally so that I never have to "npm install" it again. Most things you will want to package with your project and that you can do with the --save flag rather than the -g (or --global ...they do the same thing) flag.
Trying to just startup a simple angular app via Yeoman, using steps in this guide
http://www.sitepoint.com/kickstart-your-angularjs-development-with-yeoman-grunt-and-bower/
and get this error when trying to run grunt or grunt server:
Loading "Gruntfile.js" tasks...ERROR
Error: Cannot find module 'load-grunt-tasks'
Warning: Task "default" not found. Use --force to continue.
Here are my versions:
yo --version && grunt --version && bower --version
1.1.2<
grunt-cli v0.1.13
grunt v0.4.4
1.3.1
See screencast of this in action:
http://screencast.com/t/4ToPw3SlL2
I just encountered the same problem today, managed to resolve it with the answers here.
Basically I needed to update npm to latest version,
by using this command (the npm which came with Node-v0.10.29 package was outdated)
npm update npm -g
or
sudo npm update npm -g (i used this command on my mac)
Then type this command
npm --version (it should show 1.5.0-alpha-4 or later version)
Then type the grunt serve command
grunt serve
If you still have issues, then try running these commands
npm install
or
sudo npm install (i used this command on my mac)
Then try grunt serve command again,
grunt serve
This time, it worked for me.
If it didn't, then try this command
bower install (i did not have to use this command)
Run the following commands from the directory that has the Gruntfile.js for your project:
npm install
npm install -g bower
bower install
This will install all npm and bower based dependencies for your project.
In the screencast at 1:18 it shows install errors tied to at least multimatch. load-grunt-taskis dependent on multimatch.
Installed "load-grunt-tasks" module locally
ie
npm install load-grunt-tasks
instead of
npm install -g load-grunt-tasks
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
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
Yeoman Getting Started
Bower
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.
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
:)