为什么gulp-uglify不会破坏我的变量名称？

Question

I have the following task:

var uglify = require('gulp-uglify');

gulp.task('scripts', function () {
  gulp.src('./src/scripts/*.js')
    .pipe(concat('main.js'))
    .pipe(uglify())
    .pipe(gulp.dest('./dist'));
});

And the following 2 javascript files, test1.js :

var testOneOutput = 'function one';
console.log(testOneOutput);

And test2.js

var testTwoOutput = 'function two';
console.log(testTwoOutput);

And all the directories are setup correctly. Though when I run the task, I have no indication of whether the uglifying work. The concatenation works great though. Am I missing something?

Answer 1

In your scripts testOneOutput and testTwoOutput are global variables and by default gulp-uglify only mangles local vars.

Put your code in a function and you'll see some mangling.

function go() {
  var testOneOutput = 'function one';
  console.log(testOneOutput);
}

Answer 2

如果你想要破坏你的顶级函数，你可以给{mangle: {toplevel: true}}选项。

uglify({mangle: {toplevel: true}})

Answer 3

Perform the uglify first. Then concat the uglified files.

gulp.task('scripts', function () {
  gulp.src('./src/scripts/*.js')
    .pipe(uglify())
    .pipe(concat('main.js'))
    .pipe(gulp.dest('./dist'));
});