Gulp minified js抛出错误

Question

We have lots of separate JavaScript files, and of course they are minified into various others in Production. Currently we use Microsoft Ajax Minifier from command line for this task, but the intention is to switch to gulpjs .

The minification process itself seems to be okay, all the output files are generated, no error is written to output, etc.

But I have a weird issue, ~4-5 out of 16 minified files generated by gulpjs throw various errors, such as:

Cannot read property '...' of undefined

or

Uncaught TypeError: (intermediate value)(intermediate value)(...) is not a function

Ajax minifier is called as follows:

AjaxMin.exe -js -xml .\minify.xml -clobber -evals:safeall

A sample from the minify.xml :

<?xml version="1.0" encoding="utf-8"?>
    <root>
      <output path="..\js\min\main.min.js">
        <input path="..\js\filename1.js"/>
        <input path="..\js\filename2.js"/>
        <input path="..\js\filename3.js"/>
        ...
      </output>
      <output path="..\js\min\report.min.js">
        <input path="..\js\filename4.js"/>
        <input path="..\js\filename5.js"/>
        <input path="..\js\filename6.js"/>
        ...
      </output>
      ...
    </root>

A sample from gulpfile.js

gulp.task("[js]minify-all", function () {
    var mainFiles = [
        "./js/filename1.js",
        "./js/filename2.js",
        "./js/filename3.js",
    ];
    var reportFiles = [
        "./js/filename4.js",
        "./js/filename5.js",
        "./js/filename6.js",
    ];
    ...
    generateMinifiedFile(mainFiles, "./js/min/", "main");
    generateMinifiedFile(reportFiles, "./js/min/", "report");
    ...
}

var generateMinifiedFile = function(inputFiles, outputPath, outputFileName) {
    gulp.src(inputFiles)
        .pipe(concat(outputFileName + ".js"))
        .pipe(minify({
            ext: {
                min: ".min.js"
            },
            noSource: true
        }))
        .pipe(gulp.dest(outputPath));
};

In case it matters, here's package.json

{
  "name": "package",
  "version": "1.0.0",
  "private": true,
  "devDependencies": {
    "gulp": "3.9.1",
    "gulp-bower": "0.0.13",
    "gulp-concat": "^2.6.0",
    "gulp-config": "0.3.0",
    "gulp-less": "3.0.5",
    "gulp-minify": "0.0.12",
    "gulp-minify-css": "1.2.4",
    "gulp-plumber": "1.1.0",
    "gulp-watch": "4.3.5"
  }
}

To sum it up:

• Using non-minified js files, the site works fine.
• Using minified js files created by AjaxMin.exe , the site works fine.
• Using minified js files created by gulpjs , the site breaks.

Anyone has a suggestion what I miss?

UPDATE

Sample of creating a controller:

var settingsModule = angular.module("settingsModule", ["rootModule"]);
settingsModule.controller('settingsCasesController', ["$rootScope", "$scope", "$http", "DataService", function ($rootScope, $scope, $http, dataService) {
    ...
}

Answer 1

Note: This should be a comment, but It is an answer since it's a bit long, and an answer is easyer to write and to read...

To start with, I'd try setting to false both gulp-minify options mangle and compress .

If code runs ok, you should try setting to false only one option, to see which one is responsible of the failure.

If code breaks (this would be quite strange, since I suppose the main task of a minifier is to compress and to mangle...), I'd try to manually compare the output of one gulp-minify ed file to the source, to see what are the changes...