After installing Bootstrap 4, in Angular 4, I am getting an error : [Script Loader] Error: Bootstrap tooltips require Tether (http://tether.io/). I tried installing tether, passing tether CDN but it dint help.
1
-
Show us your code ? Based on what you say, it should work. Make sure to include Tether BEFORE Bootstrap.Kewin Dousse– Kewin Dousse2017-11-22 10:01:37 +00:00Commented Nov 22, 2017 at 10:01
Add a comment
|
2 Answers
Watch Video or Follow the step
Install bootstrap 4 in angular 4 / angular 5
There is two way to include bootstrap in your project
1) add CDN Link in index.html file
2) Install bootstrap using npm
I recommended you following 2 methods that are installed bootstrap using npm because its available on your project directory
1) install bootstrap using npm
npm install bootstrap@next --save
after the installation of Bootstrap 4, we Need two More javascript Package that is Jquery and Popper.js without these two package bootstrap is not complete
2) Install JQUERY
npm install jquery --save
3) Install Popper.js
npm install popper.js --save
Now Bootstrap is Install on you Project Directory inside node_modules Folder
open .angular-cli.json this file are available on you angular directory open that file and add the path of bootstrap, jquery, and popper.js files inside styles[] and scripts[] path see the below example
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"styles.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js",
"../node_modules/popper.js/dist/umd/popper.min.js"
],
Note: Don't change a sequence of js file it should be like this
Now Bootstrap Working fine Now
Comments
Add the reference to tether.min.css in your angular-cli.json file
styles": [
"styles.css",
"../node_modules/tether/dist/css/tether.min.css",
"../node_modules/bootstrap/dist/css/bootstrap.min.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/tether/dist/js/tether.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js"
],
2 Comments
Ramya
After a lot of trial and error, I came across this site coursetro.com/posts/design/72/Installing-Bootstrap-4-Tutorial. It helped.I added tether.min.js before bootstrap.min.js and that fixed the error.
patie
Incorrect answer, Bootstrap 4 using popper, not tether