naughty boy
naughty boy

Reputation: 2149

How to dynamically specify destination folder to gulp

I have a folder structure where I keep all my assets similar to this.

-page1
 -page1.html
 -stylesheets
  -page1
   -page1style.css

-page2
 page2.html
 stylesheets
  page2
   page1style.css

I realize that this isn't the best folder structure but I choose it this way before I could have predicted problems. In my .html files I reference a stylesheet like so /stylesheets/name-of-page/foo.css. Now I am having problems writing a gulp script since all the minified files are being placed at the specified destination folder but have the following structure.

-build
 -page1
  -stylesheets
   -page1.css

when I would like to have something like this

-build
 -page1
  -page.css

TL;DR or if my question is logic is scrambled : I would like to see the src path of the file at runtime and then perform some string manipulation to calculate its destination.

Upvotes: 1

Views: 707

Answers (1)

Sven Schoenung
Sven Schoenung

Reputation: 30564

What you're looking for is gulp-rename:

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

gulp.task('default', function() {
  gulp.src('src/**/*')
    .pipe(rename(function(file) {
      if (file.extname === '.css') {
         file.dirname = //change directory to something else
         file.basename = //change file name (without extension) to something else
      }
    }));
});

I also suggest you look into the path module instead of direct string manipulation to adjust the paths of your files.

Upvotes: 1

Related Questions