CODEWITHSUNDEEP
angularjsherokugruntjsminifymean-stack
Whisher
Whisher

Reputation: 32726

angular mean.io developer prodution uglify error on minification

Can anyone explain me what's wrong with this code:

.controller('ArticleCreateCtrl', ['$scope', '$state', '$filter', 'Articles', function ($scope, $state, $filter, Articles) {
        $scope.article = {};
        $scope.save = function(){
            $scope.article.categories = $filter('strcstoarray')($scope.article.categories);
            Articles.store($scope.article).then(
                function(data) {
                    $scope.article = data;
                    return $state.transitionTo('articles');
                }, 
                function(err) {
                    throw new Error(err);
                }
                );
        };
    }])

In the local machine works well when I run it in heroku (prodution enviroment therefore with all the js minify) I get :

Error: assignment to undeclared variable data

UPDATE (My service)

angular.module('mean.system')
    .factory('Base',['Restangular', function(Restangular) {
        return function(route){
            var elements = Restangular.all(route);
            return {
                one : function (id) {
                    return Restangular.one(route, id).get();
                },
                all : function () {
                    return elements.getList();
                },
                store : function(data) {
                    return elements.post(data);
                },
                copy : function(original) {
                    return Restangular.copy(original);
                },
                getElements : function() {
                    return elements;
                }
            };
        };
    }]);
//Articles service used for articles REST endpoint
angular.module('mean.articles').factory('Articles', ['Base', function(Base) {
    _.mixin({
        'findByCategory': function(collection,category) {
            return _.filter(collection, function(item) {
                return _.contains(item.categories, category);
            });
        }
    });
    function Articles() {
        this.findByCategory = function(collection,category){
            return _.findByCategory(collection,category);
        };
    }
    return angular.extend(Base('articles'), new Articles());
}]);

Upvotes: 1

Views: 570

Answers (2)

Skatox
Skatox

Reputation: 4284

I had the same problem, it's because you must use the ngmin task, which prepares some angular libraries to be minified.

At package.json add the following line before uglify:

"grunt-ngmin": "0.0.3"

Then update dependencies:

npm install

Then at the Gruntfile.js added the ngmin task:

ngmin: {
  production: {
    files: '<%= assets.js %>'
  }
},

Remember to add the ngmin task BEFORE uglify:

grunt.registerTask('default', ['clean','cssmin', 'ngmin','uglify', 'concurrent']);

The next time you'll run the server in production mode your code will work.

Upvotes: 1

Drew Fyock
Drew Fyock

Reputation: 103

Make sure you have uglify configured properly in Gruntfile.js, with mangle: false

uglify: {
    options: {
        mangle: false
    },
    production: {
        files: '<%= assets.js %>'
    }
},

Upvotes: 1

Related Questions