(Angular2) Cannot read property 'extend' of undefined for toastr

This did the trick for me:

"scripts": [ 
  "node_modules/jquery/dist/jquery.min.js",
  "node_modules/toastr/build/toastr.min.js",
  "node_modules/bootstrap/dist/js/bootstrap.js"
]

In that exact order inside the angular.json file under the scripts section.


Also bootstrap.min.css should bet loaded before toastr.min.js.

Environments: Angular 7 and bootstrap 4.

Below is my part of angular.json, and it is working.

   "styles": [
      "node_modules/ngf-bootstrap/dist/bootstrap.min.css",
      "node_modules/toastr/build/toastr.min.css",
      "src/styles.css"
    ],
    "scripts": [
      "node_modules/jquery/dist/jquery.min.js",
      "node_modules/bootstrap/dist/js/bootstrap.js",
      "node_modules/toastr/build/toastr.min.js"
    ]

Add this script src="node_modules/toastr/build/toastr.min.js"

After this script src="node_modules/jquery/dist/jquery.min.js"></script>

Reason : toastr.js uses jQuery, so jQuery should get loaded before toastr.js