Angular.js 'Unknown provider: iProvider <- i' error in production

Question

I am working on an Angular Project, on local it runs perfectly, but when I deploy to Divshot it breaks, and it throws an 'Unknown provider: iProvider <- i' error.

This is the link to the: Divshot development build

Any advice will be very appreciated.

Answer 1

It is because Angular resolves the provider names by literally converting a function into string and using its parameter names. When you deploy, you are probably minifying your code. Therefore something that looked like myCoolService will be minified to i or a or something else.

You have to ways to solve it: 1. Use array syntax 2. Use ngAnnotate or something else in your build to create the array syntax for you.

Read the part about Minification on https://docs.angularjs.org/tutorial/step_05

Answer 2

I assume your js code has been minifized in production. The identifier of your service provider might be renamed to something unknown.

I'd suggest your add a string identifier of your provider at injection point. E.g.

angular.module('example')
  .controller(['$scope', 'YourServiceProvider', function($scope, YourServiceProvider) {
     // ...
  });