Я не могу скомпилировать sass и перезагрузить в браузере - PullRequest
Новая
       6

Я не могу скомпилировать sass и перезагрузить в браузере

0 голосов
/ 29 ноября 2018

enter image description here ** Когда я сохранил изменения два или три раза, это работало просто отлично, но когда я сохранил изменения более трех раз, то эта ошибка произошла.Это ужасная ситуация, возникающая, когда я пытаюсь скомпилировать sass и перезагрузить браузер. Как мне решить эту проблему **

Пожалуйста, помогите мне решить эту проблему.Я добавляю исходный код gulpfile.js, а также результат ошибки.Итак, позвольте мне решить, что 

ASUS@DESKTOP-U34ESKM MINGW64 ~/Desktop/front/project-1
$ gulp start
[11:28:09] Using gulpfile ~\Desktop\front\project-1\gulpfile.js
[11:28:09] Starting 'browser-sync'...
[11:28:10] Finished 'browser-sync' after 308 ms
[11:28:10] Starting 'start'...
[11:28:10] Finished 'start' after 78 μs
[Browsersync] Access URLs:
 --------------------------------------
       Local: http://localhost:3000
    External: http://192.168.1.109:3000
 --------------------------------------
          UI: http://localhost:3001
 UI External: http://localhost:3001
 --------------------------------------
[Browsersync] Serving files from: ./
[11:28:23] Starting 'sass'...
[Browsersync] 1 file changed (style.compile.css)
[11:28:23] Finished 'sass' after 125 ms
[11:28:48] Starting 'sass'...
[Browsersync] 1 file changed (style.compile.css)
[11:28:48] Finished 'sass' after 96 ms
[11:29:01] Starting 'sass'...
[Browsersync] 1 file changed (style.compile.css)
[11:29:01] Finished 'sass' after 73 ms
[11:29:09] Starting 'sass'...
[Browsersync] 1 file changed (style.compile.css)
[11:29:09] Finished 'sass' after 80 ms
[11:29:26] Starting 'sass'...

events.js:167
      throw er; // Unhandled 'error' event
      ^
Error: sass\main.scss
Error: File to import not found or unreadable: abstracts/base.
        on line 1 of sass/main.scss
>> @import 'abstracts/base';
   ^

    at options.error (C:\Users\ASUS\Desktop\front\project-1\node_modules\node-sass\lib\index.js:291:26)
Emitted 'error' event at:
    at DestroyableTransform.onerror (C:\Users\ASUS\Desktop\front\project-1\node_modules\vinyl-fs\node_modules\readable-stream\lib\_stream_readable.js:558:12)
    at DestroyableTransform.emit (events.js:182:13)
    at onwriteError (C:\Users\ASUS\Desktop\front\project-1\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:449:12)
    at onwrite (C:\Users\ASUS\Desktop\front\project-1\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:470:11)
    at WritableState.onwrite (C:\Users\ASUS\Desktop\front\project-1\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:180:5)
    at DestroyableTransform.afterTransform (C:\Users\ASUS\Desktop\front\project-1\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:93:3)
    at errorM (C:\Users\ASUS\Desktop\front\project-1\node_modules\gulp-sass\index.js:118:12)
    at Object.callback (C:\Users\ASUS\Desktop\front\project-1\node_modules\gulp-sass\index.js:127:16)
    at options.error (C:\Users\ASUS\Desktop\front\project-1\node_modules\node-sass\lib\index.js:294:32)

const gulp = require('gulp');
const sass = require('gulp-sass');
const rename = require('gulp-rename');
const browserSync = require('browser-sync');


//Static server
gulp.task('browser-sync', function() {
    browserSync({
        server: {
            baseDir: "./"
        }
    });

    gulp.watch('sass/abstracts/*.scss', ['sass']);
});


//Compile sass and inject browser
gulp.task('sass', function () {
    
        return gulp.src("sass/main.scss")
        .pipe(sass())
        .pipe(rename('style.compile.css'))
        .pipe(gulp.dest('css/'))
        .pipe(browserSync.stream())

});

gulp.task('start',['browser-sync']);

1 Ответ

0 голосов
/ 02 декабря 2018

Попробуйте и используйте gulp-wait, он вставляет дополнительную задержку перед вызовом следующей функции в цепочке.Таким образом, изменения могут быть вычтены.

Ссылка https://github.com/olefredrik/FoundationPress/issues/731

Пример использования 

  return gulp.src("sass/main.scss")
        .pipe(wait(500))
        .pipe(sass())
...