This content applies to v6 and is no longer being maintained. For v7 and later, see current documentation here.

Global Library Installation

Some javascript libraries need to be added to the global scope and loaded as if they were in a script tag. We can do this using the scripts and styles options of the build target in angular.json.

As an example, to use Bootstrap 4 this is what you need to do:

First install Bootstrap from npm:

npm install jquery --save
npm install popper.js --save
npm install bootstrap --save

Then add the needed script files to scripts:

"scripts": [
  "node_modules/jquery/dist/jquery.slim.js",
  "node_modules/popper.js/dist/umd/popper.js",
  "node_modules/bootstrap/dist/js/bootstrap.js"
],

Finally add the Bootstrap CSS to the styles array:

"styles": [
  "node_modules/bootstrap/dist/css/bootstrap.css",
  "src/styles.css"
],

Restart ng serve if you're running it, and Bootstrap 4 should be working on your app.