Настройка browser-sync, gulp4. Как правильно указать путь к img?

Для настройки browser-sync в Gulp.js версии 4 и указания правильного пути к изображениям (img) вы можете использовать следующий код:

  1. Установите необходимые зависимости:
npm install gulp browser-sync
  1. Создайте файл gulpfile.js и подключите необходимые модули:
const gulp = require('gulp');
const browserSync = require('browser-sync').create();
  1. Определите задачу для browser-sync:
gulp.task('browser-sync', function() {
    browserSync.init({
        server: {
            baseDir: "./"
        },
        notify: false
    });
});
  1. Определите задачу для слежения за изменениями файлов и перезапуска browser-sync:
gulp.task('watch', function() {
    gulp.watch('./img/**/*', gulp.series('reload'));
});

gulp.task('reload', function(done) {
    browserSync.reload();
    done();
});
  1. Определите основную задачу, которая будет запускаться по умолчанию:
gulp.task('default', gulp.series('browser-sync', 'watch'));
  1. Запустите Gulp:
gulp
  1. Теперь, если вы перемещаете или изменяете изображения в папке "./img", browser-sync будет автоматически обновлять страницу каждый раз, когда происходят изменения.

Обратите внимание, что в данном примере предполагается, что ваши изображения находятся в папке "./img". Если у вас другая структура папок, вам нужно будет указать правильный путь в соответствии с вашей файловой структурой.