Ошибка: Chrome - не разрешено загружать локальный ресурс

Question

Пока все работает нормально с BrowserSync, но у меня глупая проблема с загрузкой файла jpg. Ошибка появляется в консоли Chrome "не разрешено загружать локальный ресурс" после того, как gulp watch автоматически запускает страницу, и все работает нормально, за исключением того, что я не вижу свою фоновую картинку на странице. Изображение находится в папке с моим проектом. У меня нет такой проблемы, когда я открываю страницу (двойной щелчок index.html) без задачи gulp watch.

Вот мой gulpfile.js:

var gulp = require("gulp");

var watch = require("gulp-watch");
postcss = require("gulp-postcss");
autoprefixer = require("autoprefixer");
cssvars = require("postcss-simple-vars");
nested = require("postcss-nested");
cssImport = require("postcss-import");
browserSync = require("browser-sync").create();

gulp.task('default', function() {
    console.log("yeeey!");
});

gulp.task("html", function() {
    console.log("html task");
});

gulp.task("styles", function() {
    return gulp.src("./app/assets/styles/styles.css")
        .pipe(postcss([cssImport, cssvars, nested, autoprefixer]))
        .pipe(gulp.dest("./app/temp/styles"));
});

gulp.task("watch", function() {

    browserSync.init({
        server: {
            baseDir: "app"
        }
    });

    watch("./app/index.html", function() {
        gulp.start("html");
    });
    watch("./app/assets/styles/**/*.css", function() {
        gulp.start("styles");
    });
});

И именно так я перешел к картинке в index.html

<img src="C:/Users/aa/Desktop/Web-dev-course/Projects/travel-site/app/assets/images/Wietnam/v111.jpg">

Спасибо за любую помощь!

Энн