Gulp.js: how to rewrite relative paths?

Question

Structure:

static
├── build
│   ├── css
│   ├── fonts
│   ├── img
│   └── js
└── src
    ├── blocks
    ├── fonts
    └── img

Piece of gulpfile.js:

var path = {
        build: {
            js: 'static/build/js',
            css: 'static/build/css',
            fonts: 'static/build/fonts',
            img: 'static/build/img'

        },
        src: {
            vendor_fonts: ['bower_components/**/*.{svg,woff,eot,ttf}', 'semantic/**/*.{svg,woff,eot,ttf}'],
            vendor_img: ['bower_components/**/*.{png,jpg,jpeg,gif}', 'semantic/**/*.{png,jpg,jpeg,gif}']

        }
};

gulp.task('vendor:img', function(){
    return gulp.src(path.src.vendor_img)
        .pipe(imagemin({
            progressive: true,
            interlaced: true,
            use: [pngguant()]
        }))
        .pipe(gulp.dest(path.build.img))
});

gulp.task('vendor:fonts', function() {
    gulp.src(path.src.vendor_fonts)
        .pipe(gulp.dest(path.build.fonts))
});

When i build 3-party packages (such as fotorama or semantic ui), they have a relative paths - as a result, main.css have only relative paths and server cant't find them.

How i can solve this?

Answer 1

If your gulpfile.jss is in your root you should be able to just prefix your paths with nodes Global Object __dirname

__dirname#
{String}
The name of the directory that the currently executing script resides in.

Example: running node example.js from /Users/mjr

console.log(__dirname);
// /Users/mjr
__dirname isn't actually a global but rather local to each module.

https://nodejs.org/api/globals.html#globals_dirname

So if your gulpfile was in your root in your paths just do

__dirname + "/build/whatever/whatever";

This all being if I understand your question correctly.