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


How do I correctly import tasks from separate files into gulpfile.js/index.js?

I have been racking my brain on getting something like this to work in a simple fashion, so if someone could please help, I would be thoroughly grateful.

Using Gulp 4 and the official instructions (without any examples) for "splitting a gulpfile," I cannot find the syntax to pull in tasks from separate files. I am using gulp --tasks to test this. The instructions state:

Each task can be split into its own file, then imported into your gulpfile for composition.

Here is what I started out trying:



function defaultTask(cb) {
  console.log('defaultTask init');

exports.default = defaultTask;


function devTask(cb) {
  console.log('devTask init');

exports.dev = devTask;


function prodTask(cb) {
  console.log('prodTask init');

exports.prod = prodTask;

What I've Tried

With these files above, when I type "gulp --list", I only see the default task, so I went searching for a way to do this without an additional plug-in. The official docs said that the tasks only needed to be imported. I tried several plug-ins to require all files within a folder or use another plug-in to pull in the files, yet those did not work with this syntax. I'm sure this is a simple problem, but its grasp is beyond me.

Thanks to anyone in advance!