Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Gulp Basics Gulp your JavaScript Workflow Using Third Party Gulp Libraries

Ian Mackenzie
Ian Mackenzie
11,062 Points

ReferenceError: concat is not defined

Getting this error, not sure what I've done wrong?

ReferenceError: concat is not defined at Object.<anonymous> (/htdocs/thgulp/gulpfile.js:4:10) at Module._compile (module.js:460:26) at Object.Module._extensions..js (module.js:478:10) at Module.load (module.js:355:32) at Function.Module._load (module.js:310:12) at Module.require (module.js:365:17) at require (module.js:384:17) at Liftoff.handleArguments (/usr/local/lib/node_modules/gulp/bin/gulp.js:116:3) at Liftoff.<anonymous> (/usr/local/lib/node_modules/gulp/node_modules/liftoff/index.js:192:16) at module.exports (/usr/local/lib/node_modules/gulp/node_modules/liftoff/node_modules/flagged-respawn/index.js:17:3)

This is my code:

"use strict";

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

gulp.task('concatScripts', function() {
    gulp.src([
        'js/jquery.js',
        'js/sticky/jquery.sticky.js',
        'js/main.js'])
    .pipe(concat('app.js'))
    .pipe(gulp.dest('js'));
});

gulp.task('default', ['hello'], function() {
    console.log('the default task!!!!');
});

3 Answers

Sean T. Unwin
Sean T. Unwin
28,690 Points

There is a discrepancy in your variable declarations and that is the concat variable is not instantiated as a local variable. If you do not explicitly declare a variable with the keyword, " var " then that variable will be placed in the global scope.

You may declare locally scoped variables on a line-by-line basis using the var keyword for each variable. Like so:

var var1 = 'I am a local variable';
var var2 = 'I am also a local variable';

When you have multiple variables to declare locally then another way is to still use the var keyword and also to use a comma to separate the variable names (as opposed the using a semi-colon as in the example above). Shown below:

var var1 = 'I am a local variable', var2 = 'I am also a local variable';

/* For better readability we may place these on separate lines
 *    - Notice the spacing to line up the variable for further readability
 */
var var1 = 'I am a local variable',
    var2 = 'I am also a local variable';

This second way (immediately above) is the method Huston Hedinger uses in the video.

To summarize the issue you are having is that you have used a semi-colon after the var gulp = require('gulp') statement whereas you should have used a comma, or alternatively, used the var keyword for both variable declarations.

I would also to recommend taking the Node.js Basics course if you haven't had much experience with Node.js. This is assuming you have some JavaScript experience and understanding.

This has been assumed that gulp-concat has been installed correctly via npm.

This only happened because we follow along exactly with the video and thats what they showed.

Ian Mackenzie
Ian Mackenzie
11,062 Points

Thank you Sean for your detailed answer and suggestions.