0

I have an AngularJS web app. The app works great without any minification. But when I minified with grunt, like this:

uglify: {
        options: {
                report: 'min',
                mangle: false
        },
        dist: {
            files: {'app/dist/js/yanpy.min.js': [Many scripts, 'app/js/controllers/shopping-cart.js', more scripts]

I get next error:

ReferenceError: shoppingCart is not defined
    at Object.$get (yanpy.min.js:9)
    at Object.invoke (yanpy-libs-1.min.js:1)
    at yanpy-libs-1.min.js:1
    at getService (yanpy-libs-1.min.js:1)
    at invoke (yanpy-libs-1.min.js:1)
    at Object.instantiate (yanpy-libs-1.min.js:1)
    at yanpy-libs-1.min.js:2
    at yanpy-libs-1.min.js:2
    at forEach (yanpy-libs-1.min.js:1)
    at nodeLinkFn (yanpy-libs-1.min.js:2)

The shoppingCart script "shopping-cart.js" in included in the grunt file for minification. The file looks like:

function shoppingCart(cartName) {
    this.cartName = cartName;
    this.clearCart = false;
    this.checkoutParameters = {};
    this.items = [];

    // load items from local storage when initializing
    this.loadItems();           
}

// load items from local storage
shoppingCart.prototype.loadItems = function () {

   // Do whatever
}

What is happening? And Why is not working when I minified and it´s working without minification?

UPDATE_1: According to the mark as duplicated, please note shopping-cart is not an angular module, but just a javascript script. So, not sure if the approach provided in the original referenced post is the real answer.

UPDATE_2: According to @UncleDave comment. I copy the two parts of code there shoppingCart is referenced.

.directive('adminOfferExtras', function(Extra, ExtraService, LocationService, OfferService, DataService) {        

    function link(scope, element, attrs) { 

        var boatId = parseInt(scope.boat.id);
        var extrasCart = new shoppingCart("OfferBoatExtrasCart_" + boatId);

and 

.factory("DataService", function () {

    // create shopping cart
    var myCart = new shoppingCart("Store");    
    return {
        cart: myCart
    };
})

Please note, the only other place where I see shoppingCart referenced is in the shopping-cart.js file, that I already copied. Maybe is this call that should be marked with a var? 

shoppingCart.prototype.loadItems = function () {

   // Do whatever
}
Rober
  • 5,868
  • 17
  • 58
  • 110
  • @georgeawg Please see my edit. Are you sure that is the same problem and approach? – Rober Jun 18 '19 at 16:14
  • I don't think this duplicate flag is accurate. Could you show the line that causes the error to be thrown? – UncleDave Jun 18 '19 at 16:29
  • 1
    There is not enough information to reproduce the problem. The most common cause of minification problems with AngularJS is use of implicit annotation for dependency injection. – georgeawg Jun 18 '19 at 16:37
  • As It´s a minified file, I´m not sure which is the line that causes the problems. According to the log error above, could you please help to identify it and I will paste it here? @UncleDave – Rober Jun 18 '19 at 17:28
  • There is no evidence that this is the same issue as the linked dependency injection problem, and without evidence "most common cause" is not a good reason to close as duplicate imo. – UncleDave Jun 18 '19 at 17:46
  • @Rober you'll have to show us where shoppingCart is referenced in the unminified code. – UncleDave Jun 18 '19 at 17:48
  • I really appreciate your help @UncleDave . It´s quite frustrating to have hard issues and only get -1. Please find the update above. – Rober Jun 18 '19 at 18:12
  • 2
    It looks like this is a simple bundle order issue. If you were using angular dependency injection for the `shoppingCart` then you wouldn't need to care about specifying your scripts in a certain order, but `shoppingCart` is just a global function. You must ensure that `shopping-cart.js` appears in the uglify `files` array BEFORE any script that wishes to make use of it. I've created a repo with a minimal reproduction, please check it out if my explanation isn't clear: https://github.com/UncleDave/stackoverflow-56643186 – UncleDave Jun 18 '19 at 19:13
  • Upon closer inspection this may not resolve your issue, but give it a go regardless and let me know. – UncleDave Jun 18 '19 at 19:30
  • I totally agree. It should be related with the order of the scripts. In my code is a little more difficult, so please let me check and I will get back to you. In the meantime your answer seems right and you made an effort to create the repository that I really appreciate. So, of course +1. – Rober Jun 19 '19 at 05:47

0 Answers0