当前位置: 动力学知识库 > 问答 > 编程问答 >

angularjs - Gulp ngmin + uglify not working properly

问题描述:

I have the following gulp task:

gulp.task('scripts', function() {

return gulp.src(['app/js/app.js', 'app/config/config.js', 'app/js/controllers.js', 'app/js/directives.js' , 'app/js/filters.js', 'app/js/footer.js',

'app/js/guideTour.js', 'app/js/mobileBanner.js', 'app/js/services.js', 'app/js/youtube.js', 'app/js/dataSync.js', 'app/js/addthis.js'])

//.pipe(jshint('.jshintrc'))

.pipe(jshint.reporter('default'))

.pipe(concat('main.js'))

.pipe(ngmin())

.pipe(gulp.dest('app/dist/js'))

.pipe(rename({suffix: '.min'}))

.pipe(uglify())

.pipe(gulp.dest('app/dist/js'))

.pipe(livereload(server))

.pipe(notify({ message: 'Scripts task complete' }));

});

The problem is that the concatenated file which is also the output of ngmin(), is working fine, but after uglifying the code, something breaks, and I get the following error.

With no specific indicator where to start debugging.

Stack trace:

Error: [$injector:unpr] http://errors.angularjs.org/1.2.9/$injector/unpr?p0=eProvider%20%3C-%20e

at Error (native)

at http://localhost:8000/angular/angular.min.js:6:449

at http://localhost:8000/angular/angular.min.js:32:125

at Object.c [as get] (http://localhost:8000/angular/angular.min.js:30:200)

at http://localhost:8000/angular/angular.min.js:32:193

at c (http://localhost:8000/angular/angular.min.js:30:200)

at Object.d [as invoke] (http://localhost:8000/angular/angular.min.js:30:417)

at http://localhost:8000/angular/angular-route.min.js:10:302

at Object.q [as forEach] (http://localhost:8000/angular/angular.min.js:7:380)

at http://localhost:8000/angular/angular-route.min.js:10:248

Any help is much appriciated

网友答案:

Solution was running uglify task with mangle option set to false. ie: .uglify({mangle: false})

whole code:

gulp.task('scripts', function() { 
return gulp.src('app/js/**/*.js')
.pipe(jshint('.jshintrc'))
.pipe(jshint.reporter('default'))
.pipe(concat('main.js'))
.pipe(ngmin())
.pipe(gulp.dest('app/dist/js'))
.pipe(rename({suffix: '.min'}))
.pipe(uglify({mangle: false}))
.pipe(gulp.dest('app/dist/js'))
.pipe(livereload(server))
.pipe(notify({ message: 'Scripts task complete' }));
});
网友答案:

You don`t need to set mangle to false, you can just use ng-annotate and call on your gulpfile.js like this:

var ngAnnotate = require('gulp-ng-annotate')
...
gulp.task('scripts', function() { 
return gulp.src('app/js/**/*.js')
.pipe(jshint('.jshintrc'))
.pipe(jshint.reporter('default'))
.pipe(concat('main.js'))
.pipe(ngmin())
.pipe(gulp.dest('app/dist/js'))
.pipe(rename({suffix: '.min'}))
.pipe(ngAnnotate())
.pipe(uglify())
.pipe(gulp.dest('app/dist/js'))
.pipe(livereload(server))
.pipe(notify({ message: 'Scripts task complete' }));
});

works on my projects for app on a single file

分享给朋友:
您可能感兴趣的文章:
随机阅读: