Compiling sass works through time, what could be the problem?

Question

Sass

Hello everyone, I am compiling sass via gulp, here is the code

'use strict';
 
let gulp = require('gulp');
let sass = require('gulp-sass');
let cleanCSS = require('gulp-clean-css');
let rename = require('gulp-rename');

gulp.task('sass', () => {
  return gulp.src('./src/styles/src/main.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(cleanCSS())
    .pipe(rename({
        suffix: '.min'
    }))
    .pipe(gulp.dest('./src/styles/dist'));
});
 
gulp.task('sass:watch', () => {
  gulp.watch('./src/styles/src/**/*.scss', ['sass']);
});

gulp.task('watch-css', ['sass', 'sass:watch']);

I run the watch-css task - then compilation happens every other time, every second time it swears in this way
File to import not found or unreadable: components/navigation. That is, once I press ctrl + s - everything is OK, the second time an error. Naturally, the path to components/navigation does not change.
Here is the structure
src
___components
__navigation.scss
main.scss
I connect the whole thing in main.scss

@import "components/navigation";
....