Gulp.js - file to import not found or unreadable. What is the problem?

Question

JavaScript

changes in html and js go as it should
on editing scss reacts with a subject, and sometimes after the second or third editing-saving
windows 7, sublime text3
gulpfile.js:

'use strict';

var gulp = require('gulp'),
    watch = require('gulp-watch'),
    prefixer = require('gulp-autoprefixer'),
    uglify = require('gulp-uglify'),
    sass = require('gulp-sass'),
    //sourcemaps = require('gulp-sourcemaps'), //?
    rigger = require('gulp-rigger'), //плагиy для импорта файлов
    cssmin = require('gulp-minify-css'),
    imagemin = require('gulp-imagemin'),
    //pngquant = require('imagemin-pngquant'), //для работы с пнг
    rimraf = require('rimraf'), // для удаления файлов
    browserSync = require("browser-sync"),
    reload = browserSync.reload;

var config = {
    server: {
        baseDir: "./build"
    },
    tunnel: true,
    host: 'localhost',
    port: 9000,
    logPrefix: "Frontend_Devil"
};

var path = {
    build: { //Тут мы укажем куда складывать готовые после сборки файлы
        html: 'build/',
        js: 'build/js/',
        css: 'build/css/',
        img: 'build/img/',
        fonts: 'build/fonts/'
    },
    src: { //Пути откуда брать исходники
        html: 'src/*.html', //Синтаксис src/*.html говорит gulp что мы хотим взять все файлы с расширением .html
        js: 'src/js/main.js',//В стилях и скриптах нам понадобятся только main файлы
        style: 'src/style/main.scss',
        img: 'src/img/**/*.*', //Синтаксис img/**/*.* означает - взять все файлы всех расширений из папки и из вложенных каталогов
        fonts: 'src/fonts/**/*.*'
    },
    watch: { //Тут мы укажем, за изменением каких файлов мы хотим наблюдать
        html: 'src/**/*.html',
        js: 'src/js/**/*.js',
        style: 'src/style/**/*.scss',
        img: 'src/img/**/*.*',
        fonts: 'src/fonts/**/*.*'
    },
    clean: './build'
};

gulp.task('html:build', function () {
    gulp.src(path.src.html) //Выберем файлы по нужному пути
        .pipe(rigger()) //Прогоним через rigger
        .pipe(gulp.dest(path.build.html)) //Выплюнем их в папку build
        .pipe(reload({stream: true})); //И перезагрузим наш сервер для обновлений
});

gulp.task('js:build', function () {
    gulp.src(path.src.js) //Найдем наш main файл
        .pipe(rigger()) //Прогоним через rigger
        //.pipe(sourcemaps.init()) //Инициализируем sourcemap
        .pipe(uglify()) //Сожмем наш js
        //.pipe(sourcemaps.write()) //Пропишем карты
        .pipe(gulp.dest(path.build.js)) //Выплюнем готовый файл в build
        .pipe(reload({stream: true})); //И перезагрузим сервер
});

gulp.task('style:build', function () {
    gulp.src(path.src.style) //Выберем наш main.scss
        //.pipe(sourcemaps.init()) //То же самое что и с js
        .pipe(sass()) //Скомпилируем
        .pipe(prefixer()) //Добавим вендорные префиксы
        .pipe(cssmin()) //Сожмем
        //.pipe(sourcemaps.write())
        .pipe(gulp.dest(path.build.css)) //И в build
        .pipe(reload({stream: true}));
});

gulp.task('image:build', function () {
    gulp.src(path.src.img) //Выберем наши картинки
        .pipe(imagemin({ //Сожмем их
            progressive: true,
            svgoPlugins: [{removeViewBox: false}],
            //use: [pngquant()],
            interlaced: true
        }))
        .pipe(gulp.dest(path.build.img)) //И бросим в build
        .pipe(reload({stream: true}));
});

gulp.task('fonts:build', function() {
    gulp.src(path.src.fonts)
        .pipe(gulp.dest(path.build.fonts))
});

gulp.task('build', [
    'html:build',
    'js:build',
    'style:build',
    'fonts:build',
    'image:build'
]);

gulp.task('webserver', function () {
    browserSync(config);
});

gulp.task('clean', function (cb) {
    rimraf(path.clean, cb);
});

gulp.task('watch', function(){
    watch([path.watch.html], function(event, cb) {
        gulp.start('html:build');
    });
    watch([path.watch.style], function(event, cb) {
        gulp.start('style:build');
    });
    watch([path.watch.js], function(event, cb) {
        gulp.start('js:build');
    });
    watch([path.watch.img], function(event, cb) {
        gulp.start('image:build');
    });
    watch([path.watch.fonts], function(event, cb) {
        gulp.start('fonts:build');
    });
});

gulp.task('default', ['build', 'webserver', 'watch']);

src/style/ main.scss

/*
* Third Party
*/
/*
* Custom
*/
@import "partials/app";

src/style/partials/ app.scss

body {
  margin: 20px;  
}

Answer 1

Gulp detects the change and starts parsing the file before it can be saved. I have seen this both in Gulp and in the usual command line with sass --watch. In my case, it was cured by transferring the project from hdd to ssd. If you don't have an ssd, either dig towards the watcher delay or create a local partition on the RAM (provided, of course, that it is enough).

Answer 2

A couple more solutions to the problem.
Just specify the path to the partials folder in the includePaths parameter. Although it didn't help me.
-------------------------------------------------- -----
Use gulp-ruby-sass instead of gulp-sass. (although ruby-sass compiles an order of magnitude slower. Compiler comparison )
------------------------------------- ------------------
And option 3 (specifically under sublime 3). There is an atomic_save
parameter in the editor settings , which is responsible for how the file is saved ( false by default ). If you set "atomic_save: true" then every time you save a file, sublime will create a copy of the edited file, make all changes to it, and then replace the old file with this copy.
This method is probably not the most correct, but you may like just such a solution (and there is no error, and you don’t need to use ruby-sass, and buy ssd).
Prescribe in sublime'a user settings.

{
  atomic_save: true
}

Answer 3

I know this question is old, but maybe it will help someone.
I had the same problem on Windows 7 where the HDD was. Just the other day I switched to Mac OS, where there is also an SDD, and this problem disappeared by itself. So really, whoever has such a problem, then either put a delay on gulp watcher or buy an SSD.