title: How to define dependencies correctly for third-party libraries in AngularJS
body: <p>I would like to integrate 'toastr' library(<a href="https://github.com/CodeSeven/toastr" rel="nofollow">https://github.com/CodeSeven/toastr</a>) and cannot understand how to use it in angular. </p>
  
  <p>When I try to define dependencies in my service, I receive the followinf error message:</p>
  
  <pre><code>Error: error:unpr
  Unknown Provider
  Unknown provider: toastrProvider
  </code></pre>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head lang="en"&gt;
      &lt;link rel="icon" type="image/png" href="assets/images/favicon.ico"&gt;
      &lt;meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"&gt;
      &lt;base href="/"&gt;
      &lt;title&gt;Todo App&lt;/title&gt;
  
      &lt;link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"&gt;
      &lt;link href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet"/&gt;
      &lt;script src="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"&gt;&lt;/script&gt;
      &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"&gt;&lt;/script&gt;
      &lt;script src="app.js"&gt;&lt;/script&gt;
      &lt;script src="app.routes.js"&gt;&lt;/script&gt;
      &lt;script src="app.constants.js"&gt;&lt;/script&gt;
      &lt;script src="blocks/logger.js"&gt;&lt;/script&gt;
      &lt;script src="todo/todo.controller.js"&gt;&lt;/script&gt;
      &lt;script src="todo/todo.factory.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body ng-app="app"&gt;
  
  &lt;section id="main"&gt;
      &lt;div class="container"&gt;
          &lt;ng-view&gt;&lt;/ng-view&gt;
      &lt;/div&gt;
  &lt;/section&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>logger.js</strong></p>
  
  <pre><code>'use strict'
  
  angular
      .module('app')
      .factory('logger', logger);
  
  logger.$inject = ['$log', 'toastr'];
  
  function logger($log, toastr) {
      var service = {
          showToasts: true,
  
          error: error,
          info: info,
          success: success,
          warning: warning,
  
          log: $log.log
      }
  
      return service;
  
      function error(message, data, title) {
          toastr.error(message, title);
          $log.error('Error: ' + message, data);
      }
  
      function info(message, data, title) {
          toastr.info(message, title);
          $log.info('Info: ' + message, data);
      }
  
      function success(message, data, title) {
          toastr.success(message, title);
          $log.success('Success: ' + message, data);
      }
  
      function warning(message, data, title) {
          toastr.warning(message, title);
          $log.warning('Warning: ' + message, data);
      }
  }
  </code></pre>
  
  <p>If I will remove 'toastr' dependency and all toastr method calls, app will work fine. What I do wrong using third-party libraries in AngularJS?</p>