Gulp pug file tracking problem?

Question

HTML

var gulp         = require('gulp'), 
    sass         = require('gulp-sass'),
    pug          = require('gulp-pug'),
    browserSync  = require('browser-sync'), 
     concat      = require('gulp-concat'), 
    uglify       = require('gulp-uglifyjs'), 
    cssnano      = require('gulp-cssnano'), 
    rename       = require('gulp-rename'), 
    del          = require('del'), 
    imagemin     = require('gulp-imagemin'), 
    pngquant     = require('imagemin-pngquant'), 
    autoprefixer = require('gulp-autoprefixer'),
    debug        = require('gulp-debug');   
    uncss	     = require('gulp-uncss'),
    concat       = require('gulp-concat');				
    cache        = require('gulp-cache'), 

    gulp.task('sass', function () {
        return gulp.src('app/sass/**/*.sass')
            .pipe(sass())
            .pipe(autoprefixer(['last 15 versions', '> 10%']))
            .pipe(gulp.dest('app/css'));				
      });

    gulp.task ('css', ['sass'], function() {
        return gulp.src('app/css/main.css')
        .pipe(cssnano())
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(gulp.dest('app/css'))
        .pipe(browserSync.reload({
            stream: true
        }))
    });

    gulp.task('uncss', function() {
        return gulp.src('app/css/*.min.css')
        .pipe(uncss({
            html: ['app/*.html']
        }))
        .pipe(gulp.dest('app/css'));
})

    gulp.task('pug', function () {
        return gulp.src('app/pug/*.pug')
        .pipe(pug({
            pretty: true
        }))
        .pipe(gulp.dest('app'))						
        .pipe(browserSync.reload({
            stream: true							
        }));
    })

    gulp.task('jsLibs', function() {
        return gulp.src('app/js/libs.js')			
        .pipe(uglify())								
        .pipe(rename({
            suffix: '.min'							
        }))
        .pipe(gulp.dest('app/js'))					
        .pipe(browserSync.reload({
            stream: true							
        }));
    });

    gulp.task('scripts', function () {
        return gulp.src('app/js/common.js')   		
        .pipe(uglify())								
        .pipe(rename({
            suffix: '.min'							
        }))
        .pipe(sourcemaps.write())					
        .pipe(gulp.dest('app/js'))					
        .pipe(browserSync.reload({
            stream: true							
        }));
    });

    gulp.task('browser-sync', function() {
        browserSync({ 
            server: { 
                baseDir: 'app' 
            },
            notify: false 
        });
    });
    

    gulp.task('scripts', function() {
        return gulp.src([ 
             // js
            ])
            .pipe(concat('libs.min.js')) 
            .pipe(uglify()) 
            .pipe(gulp.dest('app/js')); 
    });

    gulp.task('img', function() {
        return gulp.src('app/img/**/*') 
            .pipe(cache(imagemin({  
                interlaced: true,
                progressive: true,
                svgoPlugins: [{removeViewBox: false}],
                use: [pngquant()]
            })))
            .pipe(gulp.dest('dist/img')); 
    });
    
    gulp.task('default', ['css', 'pug', 'jsLibs', 'scripts', 'browser-sync'], function() {
        gulp.watch('app/sass/**/*.sass', ['css']);
        gulp.watch('app/pug/**/*.pug', ['pug']);
        gulp.watch('app/js//**/*.js', ['scripts']);
        gulp.watch('app/js/libs.js', ['jsLibs']);
    });

When I run tasks and write to pug it compiles to a new file. But browserSync doesn't see it. How to make pug compile to a specific file that already exists, rather than creating a new one?
prntscr.com/ganqw0