I am having trouble installing a datetime picker on angularjs using bower install.
I am using this library: https://github.com/Gillardo/bootstrap-ui-datetime-picker but for some reason it does not seem to be installed and the error says:
ECONFLICT Unable to find suitable version for angular
My bower.json looks as below:
{
"name": "app",
"version": "0.0.0",
"dependencies": {
"angular": "1.2.16",
"json3": "~3.3.1",
"es5-shim": "~3.1.0",
"angular-resource": "1.2.16",
"angular-cookies": "1.2.16",
"angular-sanitize": "1.2.16",
"angular-animate": "1.2.16",
"angular-touch": "1.2.16",
"angular-route": "1.2.16",
"font-awesome": "4.3.0",
"angular-bootstrap": "0.12.0",
"oclazyload": "~0.5.2",
"angular-loading-bar": "~0.7.0",
"angular-ui-router": "~0.2.13",
"angular-toggle-switch": "~1.2.1",
"metisMenu": "~1.1.3",
"angular-chart.js": "~0.5.2",
"satellizer": "~0.13.1",
"angular-payments": "*",
"angular-file-upload": "~2.2.0",
"bootstrap-select": "~1.9.3",
"ngBootbox": "~0.1.3",
"angular-ui-tinymce": "~0.0.12"
},
"devDependencies": {
"angular-mocks": "1.2.16",
"angular-scenario": "1.2.16"
},
"resolutions": {
"angular": "^1.1.5",
"bootstrap": "~3.1.1",
"angular-sanitize": "1.2.16"
},
"appPath": "app"
}
It works on my local machine if I add this parameter when using bower install --force-latest ... but this is not working on my production where I use Heroku for deploying
Related
I'm using bower.json manifest file in order to make it easy to manage and install packages.
How can I define highstock.js and drilldown.js in my bower.json file, and avoid adding it manually to my index.html file?
Bower.json file :
{
"name": "myProj",
"version": "0.0.14",
"dependencies": {
"json3": "~3.2.6",
"es5-shim": "~2.1.0",
"jquery": "2.1.1",
"angular": "1.4.14",
"bootstrap": "~3.3.5",
"webFramework": "~0.0.78",
"angular-sanitize": "~1.4.11",
"angular-bootstrap": "~1.3.1",
"angular-ui-router": "~0.2.15",
"bootstrap-intel-theme": "~0.0.1",
"ng-table": "~0.8.3",
"angular-ui-grid": "~4.0.0",
"highcharts-ng": "~0.0.13",
"moment": "~2.13.0",
"highcharts": "^5.0.0",
"bootstrap-select": "^1.10.0",
"angular-clipboard": "~1.4.0",
"angular-messages": "~1.4.14",
"angular-animate": "~1.4.14",
"angular-resource": "~1.4.14",
"angular-material": "^1.1.11",
"angular-aria": "~1.4.14"
},
"devDependencies": {
"angular-mocks": "~1.4.11"
},
"resolutions": {
"moment": "~2.13.0",
"angular-bootstrap": "~1.3.1",
"bootstrap": "~3.3.5",
"angular": "1.4.14",
"angular-messages": "~1.4.14",
"angular-animate": "~1.4.14",
"angular-resource": "~1.4.14"
},
"overrides": {}
}
You can install highcharts package like that:
bower install highcharts
Then you need to load it as a module (ES6 module example):
import Highcharts from 'highcharts';
// Load the drilldown module.
import Drilldown from 'highcharts/modules/drilldown';
// Initialize drilldown module.
Drilldown(Highcharts);
Docs:
https://www.npmjs.com/package/highcharts#install-from-bower
https://www.npmjs.com/package/highcharts#load-highcharts-as-an-es6-module
{
"name": "concur-frontend",
"version": "0.0.0",
"dependencies": {
"angular": "1.5.8",
"bootstrap": "3.3.7",
"angular-animate": "1.5.8",
"angular-cookies": "1.5.8",
"angular-resource": "1.5.8",
"angular-route": "1.5.8",
"angular-sanitize": "1.5.8",
"angular-touch": "1.5.8",
"angular-ui-router": "0.3.2",
"lodash": "3.0.0",
"restangular": "1.6.1",
"angular-bootstrap": "1.2.5",
"ui-bootstrap": "2.5.0",
"angular-spinner": "0.8.1",
"spin": "1.1.6",
"bootstrap-ui-datetime-picker": "2.3.1"
},
"devDependencies": {
"angular-mocks": "^1.4.0"
},
"appPath": "app",
"moduleName": "meetingApp",
"overrides": {
"bootstrap": {
"main": [
"less/bootstrap.less",
"dist/css/bootstrap.css",
"dist/js/bootstrap.js"
]
}
},
"resolutions": {
"angular-bootstrap": "~1.2.0"
}
}
The above is my bower.json file and i get the error in the console
bower restangular#1.6.1 ENOTFOUND Package restangular not found
I searched for the similar error and found few links saying the bower 1.8.x has similar errors but i do get the same in 1.7.9 as well.
Let me know if i am going wrong anywhere, i am searching for this since 4 days but still no-luck
Thanks in Adv.
I am getting the following message while running bower install command.
bower.json:
{
"name": "test-app",
"version": "1.1.6",
"dependencies": {
"jquery": "2.1.0",
"jquery-bridget": "*",
"angular": "1.3.15",
"json3": "~3.2.6",
"es5-shim": "~2.1.0",
"angular-resource": "1.3.15",
"angular-sanitize": "1.3.15",
"angular-animate": "1.3.15",
"angular-cookies": "1.3.15",
"angular-touch": "1.3.15",
"angular-moment": "~0.6.2",
"angular-loading-bar": "0.6.0",
"angular-masonry": "0.11.0",
"js-cookie": "2.1.3"
},
"devDependencies": {
"angular-mocks": "1.3.15",
"angular-scenario": "1.3.15"
}
}
Can anyone help me here to how to proceed ahead.
Thanks,
Santosh
Thats because the dependencies you are injecting requires different versions of angularJs. For resolving it, first find a suitable compatible version of angularJs. And then you can add resolutions to the object in your bower.json file and specify the component name & version to automatically resolve the conflict when running bower commands. Like this:
{
"name": "test-app",
"version": "1.1.6",
"dependencies": {
"jquery": "2.1.0",
"jquery-bridget": "*",
"angular": "1.3.15",
"json3": "~3.2.6",
"es5-shim": "~2.1.0",
"angular-resource": "1.3.15",
"angular-sanitize": "1.3.15",
"angular-animate": "1.3.15",
"angular-cookies": "1.3.15",
"angular-touch": "1.3.15",
"angular-moment": "~0.6.2",
"angular-loading-bar": "0.6.0",
"angular-masonry": "0.11.0",
"js-cookie": "2.1.3"
},
"devDependencies": {
"angular-mocks": "1.3.15",
"angular-scenario": "1.3.15"
},
"resolutions": {
"angular": "1.3.15"
}
}
Try to upgrade to a recent angular-moment version like ~0.10
You can explicitly tell bower to install specific version of a dependency using the resolutions attribute. Like this:
"dependencies": {
"jquery": "2.1.0",
"jquery-bridget": "*",
...
},
"resolutions": {
"angular": "1.4.8",
...
}
I ran a bower install and have some sort of dependency conflict, everything works and the site loads fine with no errors but the bootstrap modals won't animate. animate is set to true. Any tips for debugging this would be appreciated.
{
"name": "myApp",
"version": "0.0.0",
"dependencies": {
"angular": "1.4.3",
"json3": "~3.2.6",
"es5-shim": "~2.1.0",
"jquery": "~1.11.0",
"bootstrap": "~3.0.3",
"angular-resource": "1.4.3",
"angular-cookies": "1.4.3",
"angular-sanitize": "1.4.3",
"angular-ui-router": "~0.2.15",
"ng-clip": "*",
"angular-scroll-glue": "~2.0.6",
"ng-timeago": "*",
"angular-bootstrap": "~0.13.2",
"ng-file-upload-shim": "~6.2.1",
"bootstrap-carousel-swipe": "*",
"jquery.maskedinput": "~1.4.1",
"ngAutocomplete": "~1.0.0"
},
"devDependencies": {
"angular-mocks": "1.4.3",
"angular-scenario": "1.4.3"
},
"resolutions": {
"angular": ">1.0.6"
}
}
Looks like this is only supported in Angular 1.4.5 +.
I got several packages loaded. But each time I run grunt serve or grunt it removes one from my index.html file
<script src="bower_components/angular-csv-import/dist/angular-csv-import.js"></script>
My bower.json file:
{
"name": "client",
"version": "0.0.0",
"dependencies": {
"angular": "^1.2.27",
"json3": "^3.3.0",
"es5-shim": "^4.0.0",
"bootstrap-sass-official": "^3.1.1",
"angular-animate": "^1.2.27",
"angular-cookies": "^1.2.27",
"angular-messages": "^1.2.27",
"angular-resource": "^1.2.27",
"angular-sanitize": "^1.2.27",
"angular-touch": "^1.2.27",
"underscore": "~1.7.0",
"angular-csv-import": "~0.0.14",
"angular-ui-router": "~0.2.13",
"angular-bootstrap": "~0.12.0",
"font-awesome": "~4.2.0",
"angular-rangeslider": "~0.0.11",
"highcharts-ng": "~0.0.7",
"highcharts-release": "~4.0.4",
"ng-csv": "~0.3.1"
},
"devDependencies": {
"angular-mocks": "~1.2.27",
"angular-scenario": "~1.2.27"
},
"appPath": "app"
}
It's also in my karma.conf.js file.
Why is it removing angular-csv-import from my index.html file?