我已经建立了一个新项目来使用Gulp和Sass测试Foundation 6,但它似乎根本没有编译。还有一个与此主题相关的帖子,但是我个人认为公认的答案不是正确的解决方案-因为它包含所有组件,并且实际上与Zurb建议的相反(请参阅此问题:https : //github.com / zurb / foundation-sites / issues / 7537)。反正 ...
我从bower安装了Foundation 6.1.1,并gulp-sass
以gulpfile.js
如下方式将路径添加到我的函数中:
// Compile Our Sass
gulp.task('sass', function() {
return gulp.src('scss/theme.scss')
.pipe(sass({ includePaths : ['bower_components/foundation-sites/scss'], outputStyle: 'expanded'}).on('error', sass.logError))
.pipe(gulp.dest('css/'))
});
我theme.scss
的如下:
//vendor file
@import '../bower_components/foundation-sites/scss/settings/settings';
@import '../bower_components/foundation-sites/scss/foundation';
body{
background: red;
}
编译我的scss时,没有任何错误,但是的输出theme.css
如下所示:
/**
* Foundation for Sites by ZURB
* Version 6.1.1
* foundation.zurb.com
* Licensed under MIT Open Source
*/
body {
background: red;
}
因此,由于已输出注释,因此似乎正在命中该文件,但未在中编译任何Sass导入foundation.scss
。