Questioner
Questioner

Reputation: 7463

Gulp doesn't combine or uglify

I seem to have configured Gulp to run in Netbeans. My goal is to have gulp simply combine all Javascript files from one directory into one file, and then "uglify" the that resulting file.

When I save one of my Javascript file, a new Javascript file is created, but, it is not combined with any other files, nor is it uglified. I don't get any error messages, but I don't get any desired results either. Where am I going wrong?

Here is my gulpfile.js:

var gulp = require('gulp'),
    gp_concat = require('gulp-concat'),
    gp_rename = require('gulp-rename'),
    gp_uglify = require('gulp-uglify');

gulp.task('combine', function(){
    return gulp.src(['*.js'])
        .pipe(gp_concat('concat.js'))
        .pipe(gulp.dest('dist'))
        .pipe(gp_rename('uglify.js'))
        .pipe(gp_uglify())
        .pipe(gulp.dest('dist'));
});

gulp.task('default', ['combine'], function(){});

And here is my package.json:

{
    "name": "xxxxxxxxxxxxxxxxxx",
    "version": "1.0.0",
    "keywords": ["util", "functional", "server", "client", "browser"],
    "author": "xxxxxxxxxxxxxxxxxx",
    "contributors": [],
    "dependencies": {},
    "scripts" :
    {
        "watch" : "watchify ../../html/xxxxxxxxxxxxxxxxxx/js/*.js -o ../../html/xxxxxxxxxxxxxxxxxx/bundle.js -v"
    }
}

Note that these are files I copied from examples here on Stack Overflow and elsewhere in the web, so I'm sure I'm missing something.


Latest Update:

I am now using this revised Gulp file, with directory paths corrected:

var gulp = require('gulp'),
    expect = require('gulp-expect-file'),
    concat = require('gulp-concat'),
    minify = require('gulp-minify'),
    gutil = require('gulp-util'),
    babel = require('gulp-babel'),
    jsFiles = '../../html/public_html/js/*.js',
    jsDest = '../../public_html/dist';

gulp.task('combine', function ()
{
    return gulp.src(jsFiles)
        .pipe(expect(jsFiles))
        .pipe(babel({presets: ['babili']}))
        .pipe(concat('concat.js'))
        .pipe(minify().on('error', gutil.log))
        .pipe(gulp.dest(jsDest));
});

When I run it, I still don't get any resulting combined file in my dist/folder.

I now get this error output:

[11:53:13] Using gulpfile ~\Documents\NetBeansProjects\Project_Name\gulpfile.js
[11:53:13] Starting 'combine'...
[11:53:13] Tested 5 tests, 5 passes, 0 failures: PASS
Done.

events.js:160
      throw er; // Unhandled 'error' event
      ^
SyntaxError: ..\..\html\html\public_html\js\*.js
Unexpected token: operator (>) (line: 30, col: 34, pos: 95518
    at JS_Parse_Error.get (eval at <anonymous> (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\uglify-js\tools\node.js:27:1), <anonymous>:86:23)
    at PluginError.<anonymous> (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\gulp-util\lib\PluginError.js:37:60)
    at Array.forEach (native)
    at new PluginError (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\gulp-util\lib\PluginError.js:36:16)
    at Transform.minify [as _transform] (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\gulp-minify\index.js:117:23)
    at Transform._read (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:184:10)
    at Transform._write (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:172:12)
    at doWrite (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:237:10)
    at writeOrBuffer (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:227:5)
    at Transform.Writable.write (C:\Users\Project Username\Documents\NetBeansProjects\Project_Name\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:194:11)

Upvotes: 1

Views: 581

Answers (1)

Alexander Elgin
Alexander Elgin

Reputation: 6956

Try this

var gulp = require('gulp'),
    expect = require('gulp-expect-file'),
    concat = require('gulp-concat'),
    minify = require('gulp-minify');

gulp.task('combine', function() {
    var files = ['*.js'];
    gulp.src(files)
        .pipe(expect(files))
        .pipe(concat('concat.js'))
        .pipe(minify())
        .pipe(gulp.dest('dist/'));
});

```

You should also add the following lines "gulp-minify": "0.0.14" and "gulp-expect-file": "0.0.7" to the devDependencies of your package.json

I am not sure but it seems that the pattern ** (any folder) does not work in gulp. Hence your pattern *.js will search files with js extension in the root folder only.

Upvotes: 1

Related Questions