Gulp-webserver : link to css doesn't work if outside the html folder?

Question

If I have a html file and link to a css file that is in the same folder or a subfolder, the css is included when running gulp webserver.

But if I have the css file outside the html-folder, it doesn't get included.

So for example, if the css is in the same folder, I can write:

 <link rel="stylesheet" href="style.css">

and it will work. If I place it outside in the parent folder, and link to it:

 <link rel="stylesheet" href="../style.css">

it doesn't work. Is this a problem with gulp webserver or have I overlooked something? I would like to have the css at a diefferent place, like this:

<link rel="stylesheet" href="../../builds/development/postcss/css/style.css">

In the browser, it says "failed to load resource".

Here is the webserver task:

gulp.task('webserver', function() {
    gulp.src(htmlFolder)
    .pipe(webserver({
        livereload: true,
        open: true
    }));
});

The root is the farthest back it can go: github.com/schickling/gulp-ebserver#usage. — SteveLacy
– SteveLacy, Commented Apr 21, 2016 at 21:42

SteveLacy · Accepted Answer · 2016-04-21 21:49:09Z

2

The src is the root of the server, you can't access it's parent due to security issues.

gulp-webserver does support middleware, such as serve-static.

var serveStatic = require('serve-static');

gulp.task('webserver', function() {
    gulp.src(htmlFolder)
    .pipe(webserver({
        livereload: true,
        open: true,
        middleware: [serveStatic(__dirname + '/builds')]
    }));
});

answered Apr 21, 2016 at 21:49

SteveLacy

4,1772 gold badges26 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Max Lawrence · Accepted Answer · 2021-07-18 18:05:02Z

0

I think the better way is to use the "browserSync" in nowadays.

function do_browserSync(done) {
    browserSync({
        server: {
            baseDir: '.'
        },
        startPath: 'debug/index.html',
        port: 8000,
        open: true,
        notify: false
    });
    done();
};

answered Jul 18, 2021 at 18:05

Max Lawrence

4386 silver badges15 bronze badges

Collectives™ on Stack Overflow

Gulp-webserver : link to css doesn't work if outside the html folder?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related