-1

我正在使用 AngularJS，并且我的应用程序 JS 设置如下。

var userApp = angular.module('userApp',['ngRoute','ngAnimate', 'bw.paging', 'appConfig', 'userControllers']);

userApp.run(function($rootScope, $location) { 
    $rootScope.pagination = { };
});

userApp.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
}]);

userApp.config(['$routeProvider', function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl : 'partials/index.html', 
            controller : 'IndexController' 
        })
        .otherwise({ 
            templateUrl : 'partials/routeNotFound.html', 
            controller : 'NotFoundController' 
        });
}]);

var userControllers = angular.module('userControllers', []);

然后我继续使用 gulp 对这个 JS 文件进行 lint。

gulp.task('lint1', function() {
    gulp.src('test.js')
        .pipe(jshint())
        .pipe(jshint.reporter('default'));
});

我没有报告任何错误。接下来，我继续使用gulp-uglify.

gulp.task('minify1', function() {
    gulp.src('test.js')
        .pipe(uglify())
        .pipe(gulp.dest('dist'));
});

我得到一个缩小的输出。但是，当我在我的 html 应用程序中使用缩小的输出时，我得到一个 AngularJS 错误。当我将丑化的 JS 美化回来（通过 jsbeautifier.org）时，我看到以下结果。

var userApp = angular.module("userApp", ["ngRoute", "ngAnimate", "bw.paging", "appConfig", "userControllers"]);
userApp.run(function(r, e) {
    r.pagination = {}
}), userApp.config(["$httpProvider", function(r) {
    r.defaults.useXDomain = !0
}]), userApp.config(["$routeProvider", function(r) {
    r.when("/", {
        templateUrl: "partials/index.html",
        controller: "IndexController"
    }).otherwise({
        templateUrl: "partials/routeNotFound.html",
        controller: "NotFoundController"
    })
}]);
var userControllers = angular.module("userControllers", []);

如您所见，,应该有分号的地方有逗号;。我的输入 JS 文件是坏的还是gulp-uglify搞砸了？我该如何解决这个问题？

4

3 回答 3

2

改变：

userApp.run(function($rootScope, $location) { 
    $rootScope.pagination = { };
});

至：

userApp.run(['$rootScope', '$location', function($rootScope, $location) { 
    $rootScope.pagination = { };
}]);
于 2015-09-07T11:11:23.827 回答
1

问题不在于丑化，而是您自己的代码。它打破了 Angular 的依赖注入；

userApp.run(function($rootScope, $location) { 
    $rootScope.pagination = { };
});

应该

userApp.run(['$rootScope', '$location', function($rootScope, $location) { 
    $rootScope.pagination = { };
}]);

或者，您可以使用 ng-annotate 来为您处理这个依赖注入问题。https://www.npmjs.com/package/gulp-ng-annotate

于 2015-09-07T11:12:08.740 回答
0

我们使用 gulp-uglify 和 underwood Uglify-js 发现了同样的问题。经过长时间的研究我们发现了问题， gulp -uglify对Latest 3.xx Uglify-js的依赖很弱，新版本v3.15.0开始改变行为并开始使用'，'代替'来编写js ;'。

缩小的 js 可能是正确的，但在小时情况下，javascript 结果不是 100% 兼容的，在一些浏览器中，我们的代码有一些问题。我们修复了它，强制 NPM 使用npm-force-resolutions和package-lock.json解决对 v3.14.5（最后一个旧行为）的依赖。

于 2022-03-01T18:25:01.937 回答