Gulp-sass无法编译scss文件
我正在使用Gulp将我的sass编译为css。一个简单的任务编译_/sass
目录中的style.scss
文件,并将输出保存到项目的根目录中。 style.scss
仅用于导入_/sass
目录中的其他文件。Gulp-sass无法编译scss文件
当我从命令行($ 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'
文件让你进口的是,你只需要把这个includePaths
选项你一口青菜模块作为一个参数:
gulp.src('./_/sass/style.scss')
.pipe(sass({ includePaths : ['_/sass/'] }))
.pipe(gulp.dest('./'));
...应该为你做。
为此,你需要做同样的gulpfile.js文件夹开始
@import '_/sass/reset'
我觉得咕嘟咕嘟读取进口和发现从那里gulpfile.js位于
的全部内容可悲的是这并没有工作:( – Jeshua
咕嘟咕嘟,青菜只用新的功能,使我们能够更新包括@import的路径https://npmjs.org/package/gulp-sass –
如果您使用的是Windows和崇高的文本,我们应该在Sunlime配置添加规则。只需添加在首"atomic_save" : true
>设置 - 用户
编辑,包括style.scss – Jeshua