3

I am a beginner at using Gulp and I don't know a lot about what is possible and what not. I would like to achieve the following:

my setup for 1 project:

.dist
├── client-1
│ ├── campaign-1
│ │ ├── project-a
│ │ │ ├── css (folder)
│ │ │ ├── js (folder)
│ │ │ ├── images (folder)
│ │ │ ├── index.html
│ │ │ └── preview.html

(Every project has the same structure. I have multiple clients with different names with different campaigns.)

!! I would like to make a zip file for each project with all files and folders included, except the file preview.html. If the name can be the name of the project, that would be even better.

.dist
├── client-1
│ ├── campaign-1
│ │ ├── project-a
│ │ │ ├── css (folder)
│ │ │ ├── js (folder)
│ │ │ ├── images (folder)
│ │ │ ├── index.html
│ │ │ ├── preview.html
│ │ │ └── project-a.zip (new)

If I unzip the zipfile, I would like to see the following (not inside a folder):

  • css (folder and contents)
  • js (folder and contents)
  • images (folder and contents)
  • index.html

How can I set up Gulp task(s) to do this zipping for me?

jww
  • 97,681
  • 90
  • 411
  • 885
  • [`gulp-zip`](https://www.npmjs.com/package/gulp-zip) + [excluding files/directories from Gulp task](http://stackoverflow.com/questions/23384239/excluding-files-directories-from-gulp-task) = it's possible – Sven Schoenung Oct 30 '16 at 11:26
  • Hello @SvenSchoenung, Also specific folders with wildcard folders in between? – Duncan de Jong Oct 30 '16 at 21:07
  • Were you wondering how to do this, or really just wondering if your goal is impossible? – henry Oct 31 '16 at 14:36
  • I was wondering if AND how this goal was achievable. @henry – Duncan de Jong Nov 02 '16 at 08:28
  • Okay, I thought so. As @SvenSchoenung said, you'll need `gulp-zip` for the zipping, and (as in the answer to that linked question) you'll use a `!negation` glob to exclude the `preview.html`s. To do each project separately use [`gulp-flatMap`](https://github.com/mariusGundersen/gulp-flatMap). To name the zip after the project, you'll do something like in the answer to [this question](http://stackoverflow.com/questions/32256964) (there `gulp-flatMap` is called by its old name, `gulp-foreach`). – henry Nov 02 '16 at 19:10
  • @ henry Thank you! I'll have a look for sure! – Duncan de Jong Nov 03 '16 at 20:46

1 Answers1

4

You can do this with the help of gulp-zip.

If you want to exclude specific files or folders from zipping, you can amke use of regular expressions. Check this once, Excluding files/directories from Gulp task

See below:

const gulp = require('gulp');
const zip = require('gulp-zip');

gulp.task('default', () => {
  return gulp.src([ 'js/**/*.js', '!js/**/*.min.js' ]) // Here I'm excluding .min.js files
    .pipe(zip('archive.zip'))
    .pipe(gulp.dest('dist'));
});

If you want exclude or include any specific folders or files, you can do that with regex also . Let's say, If you want to exclude folders which starts with underscore('_') symbol from zip, you do like this,

gulp.src('js/[^_]*/*.js'); // Here I'm excluding folders that start with '_' symbol

Just like, what we write in javascript, same regex will works here. Hope this helps :)

Luke Stevenson
  • 10,357
  • 2
  • 26
  • 41
Amaresh C.
  • 579
  • 5
  • 17
  • thank you, it is part of a solution, but i still want to target specific files at a specific "depth" of the filestructure. – Duncan de Jong Nov 02 '16 at 08:33
  • Do you want to zip all projects at one shot or perform it one project at time? – Amaresh C. Nov 02 '16 at 08:35
  • Cinnakotla It would be nice to create a zip of every project in one campaign at a time... :-). Because If it would zip all projects an I would add more projects every time, it would only add up to time. – Duncan de Jong Nov 03 '16 at 20:45