Install angularjs ui.router with bower - angularjs

I am new to angularjs I want to use the ui-router with bower.
I have added the following line to my bower.json
"angular-ui-router": "0.2.15"
the I have ran
bower install
I want to include the module in my index.html but I don't know which path to use.

By default bower installs packages inside bower_components directory. Make sure that this directory is web accessible. You can then include the script from:
bower_components/angular-ui-router/release/angular-ui-router.min.js
You can also change the default bower_components directory by setting a new value in your .bowerrc file as:
{
"directory": "./foo/bar"
}
This way bower will install packages inside foo/bar path instead of the default bower_components

Open terminal, go to project path.Use command,
$ bower install angular-ui-router

Related

Dotnet core add bower and static files

I've just created a new dotnet core project with the following:
dotnet new webapi
The created the following folders and files:
bin
controllers
obj
wwwroot (empty)
dotnet.csproj
Program.cs
Startup.cs
Now i want to get started with bower (bootstrap, jQuery, angular 1.x) and add static files to my project. But this should be added in wwwroot folder with lib, images, js and css, right? How do i add this to my current project?
I've checked the following link to add static files, but gives me an error:
https://learn.microsoft.com/en-us/aspnet/core/fundamentals/static-files#serving-default-files
the type or namespace name 'StaticFiles' does not exist in the name space 'Microsoft.AspNetCore'
Thanks in advance!
Install bower globally on your system: npm install -g bower
Create .bowerrc file in the root of your application with the following content, this tells bower where to restore files:
{
"directory": "wwwroot/lib"
}
Initialise bower by running bower init, this will create a bower.json file in the root of you application. You can now start install vendor packages by running a command like the following - nb. you can search for packages at https://bower.io/search/:
bower install jquery --save
To start serving static files from your dotnetcore application run the following:
dotnet add package Microsoft.AspnetCore.StaticFiles
Then in your Startup.cs add the line app.UseStaticFiles(); before the line app.UseMvc();
Restore, build, run and you should be able to access your static files in a url like http://localhost:5000/lib/jquery/dist/jquery.js
You need to add Static Files dependency in your project.json file
"Microsoft.AspNetCore.StaticFiles": "1.0.0"

Using bower_components with Grunt

I created a simple data listing app using angular js.
I used Bower and also grunt. Grunt to serve the project with a specific port. But have a error.. When i'm serve the project with Grunt, the bower_components are not working. I mean all the jquery and also angular parts get 404. I here by attach a link to my project.
Get my project here - https://github.com/chanakaDe/DemoApp
First clone it, then "npm install" and then "bower install".
Please tell me how to make them work.
Always get 404 errors like this
GET http://localhost:1701/bower_components/jquery/dist/jquery.js 404
You're specifying ./src as the root of your server in the Gruntfile. Unfortunately, bower installs it's dependencies a folder above it, in the root of your project. Your HTML has a couple of script tags with ../bower_components/[path to files], but this will not work.
You need to try to install the bower dependencies in your src folder. Add a .bowerrc file in the root of your project with the following content:
{
"directory" : "src/bower_components"
}
Then reinstall bower dependencies by doing:
$ bower install
Check if a folder bower_components have been created in your src folder.
Next replace ../bower_components with bower_components in the index.html file.

Download persice i18n locale in Angularjs using Bower

I'm using Wiredep tool with Gulp, to inject into my index.html on the run everything that I install using Bower. I don't want to download all the files listed here.
Is there a way to download only precise locale?
I've tried
bower install angular-i18n/angular-locale_uk-ua.js
And I got
fatal: remote error:
Repository not found.
In order to do this angular/bower-angular-i18n repo should be forked.
If the concern is to lower bower_components footprint on server side, postinstall hook can be supplied in .bowerrc to delete extra files from the package after installation.

bower ENOTFOUND Package App States=bower.json not found

How can I fix the following problem?
aaa#aaa $ bower install bower.json
bower bower.json#* cached git://github.com/Kalitte/app-states.git#0.6.9
bower bower.json#* validate 0.6.9 against git://github.com/Kalitte/app-states.git#*
bower webcomponentsjs#~0.5.4 cached git://github.com/Polymer/webcomponentsjs.git#0.5.5
bower webcomponentsjs#~0.5.4 validate 0.5.5 against git://github.com/Polymer/webcomponentsjs.git#~0.5.4
bower ENOTFOUND Package App States=bower.json not found
bower ENOTFOUND Package App States=bower.json
not found
I don't know how or at what point this happened, but it happened to me and if you look inside your bower_components folder there maybe a folder called App States. I deleted this folder and I was able to do an install.
You have your bower config in bower.json file, right? You don't give the file as argument, it messes like you show.
So, type in the folder that holds the bower.json file only
bower install
That command will find the bower.json for you automatically.
In my case, the bower had created "App States" folder and after deleting the folder the error got resolved.
After deleting the folder: execute
bower install --allow-root
This should fix the issue.

gulp-inject not loading all bower components

I'm using the yeoman generator-gulp-angular to scaffold my app. I installed ng-18next with bower, and the package and it's dependency were both correctly installed in the bower_components directory. However, when I run gulp serve and view the source the components aren't being injected into page, so I get a module instantiation error. If I hard code the deps into the page there are no errors. I also tried bower install --save and the deps are inserted into the bower.json file correctly. Any ideas?
Thanks.
I had hard-coded script references in index.html. Even though they were commented, this caused them not to be injected with wiredep.

Resources