Gulp-sass не удается скомпилировать scss-файл

Question

Я использую Gulp для компиляции моего sass в css. Простая задача компилирует файл style.scss в каталог _/sass и сохраняет результат в корне проекта. style.scss используется только для импорта других файлов в каталог _/sass.

Когда я запускаю задачу по умолчанию из командной строки ($ gulp), я получаю сообщение об ошибке, которое sass не может скомпилировать. Он включен ниже в полном объеме. Я удалил все содержимое из включенных файлов и снова запустил задачу. Я по-прежнему получаю ту же ошибку (что-то, что я читал в Интернете, предположил, что это может протестировать проблему с кодировкой. Я не совсем понимаю кодировку и как это может повредить вещи в моем сценарии).

Я также запускался из командной строки $ sass _/sass/style.scss style.css, который отлично работает с контентом во входящих файлах. Это говорит о проблеме с самим плагином gulp sass.

Соответствующие фрагменты из gulpfile.js:

var gulp = require('gulp'); 
var sass = require('gulp-sass'); 

// Compile sass files 
gulp.task('sass', function() { 
    gulp.src('./_/sass/style.scss') 
     .pipe(sass()) 
     .pipe(gulp.dest('./')); 
}); 

// The default task (called when you run `gulp`) 
gulp.task('default', function() { 
    gulp.run('sass'); 

    // Watch files and run tasks if they change 

    gulp.watch(['./_/sass/style.scss'], function() { 
    gulp.run('sass'); 
    }) 
}); 

Полное содержание style.scss:

/* RESET */ 
@import '_/sass/reset'; 
/* TYPOGRAPHY */ 
@import '_/sass/typography'; 
/* MOBILE */ 
@import '_/sass/mobile'; 
/* MAIN */ 
@import '_/sass/main'; 

Структура каталога:

├── _ 
│   ├── inc 
│   │   ├── stuff 
│   ├── js 
│   │   ├── otherstuff.js 
│   └── sass 
│    ├── main.scss 
│    ├── mobile.scss 
│    ├── print.scss 
│    ├── reset.scss 
│    ├── style.scss 
│    └── typography.scss 
├── gulpfile.js 
└── style.css 

Терминал выплевывает:

[gulp] Using file /Users/jeshuamaxey/project/dir/path/gulpfile.js 
[gulp] Working directory changed to /Users/jeshuamaxey/project/dir/path/html5reset 
[gulp] Running 'default'... 
[gulp] Running 'sass'... 
[gulp] Finished 'sass' in 3.18 ms 
[gulp] Finished 'default' in 8.09 ms 

stream.js:94 
     throw er; // Unhandled stream error in pipe. 
      ^
source string:11: error: file to import not found or unreadable: 'reset' 

Answer 1

Держите импорт в есть, просто передать параметр includePaths в модуле Sass глотка в качестве аргумента:

gulp.src('./_/sass/style.scss') 
     .pipe(sass({ includePaths : ['_/sass/'] })) 
     .pipe(gulp.dest('./')); 

... должны сделать это для вас.

По https://github.com/dlmanning/gulp-sass/issues/1

Answer 2

Для этого нужно начать делать с папкой же gulpfile.js

@import '_/sass/reset' 

Я думаю, что Глоток читает импорт и найти файл, где gulpfile.js расположены

Answer 3

Если вы используете Windows, и Sublime текст, мы должны добавить правила в вашей Sunlime конфигурации. Просто добавьте "atomic_save" : true в Настройки> Настройки-пользователя

https://github.com/dlmanning/gulp-sass/wiki/Common-Issues-and-Their-Fixes#partials-sporadically-not-found