我使用Gulp将我的sass编译成css.一个简单的任务编译_ / sass目录中的style.scss文件,并将输出保存到项目的根目录中. 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'
解决方法
保持您的导入,只需传递您的gulp sass模块中的includePaths选项作为参数：
gulp.src('./_/sass/style.scss')
.pipe(sass({ includePaths : ['_/sass/'] }))
.pipe(gulp.dest('./'));
…应该为你做
根据https://github.com/dlmanning/gulp-sass/issues/1