Question

我正在使用Zurb的Foundation 5构建自定义Wordpress主题，并使用Gulpjs进行编译，这非常快。我在我的WP主题文件夹中安装了Gulpjs，每次我完美保存它时它都会编译我的app.scss文件。但是，如果我对基金会中包含的任何Sass部分进行任何更改，Gulp都不会自动编译它们，直到我对app.scss进行更改并再次保存app.scss。

当我保存部分或部分中包含的任何其他.scss文件时，有什么方法可以自动编译吗？

这是我使用的首发主题的链接，显示我正在使用的所有文件。 gulpfile.js可以在根文件夹中找到。

https://github.com/schikulski/gromf

谢谢！

Answer 1

想出来！如果有人需要类似的帮助。

我添加了

'bower_components/foundation/scss/foundation/components/_*.scss'

到gulpfile.js

gulp.task('sass', function (){
    gulp.src([
        'bower_components/foundation/scss/normalize.scss',                
        'bower_components/foundation/scss/foundation/components/_*.scss',
        'assets/scss/app.scss'])                                         
        .pipe(sass({style: 'compressed', errLogToConsole: true}))         
        .pipe(concat('main.css'))                                         
        .pipe(rename({suffix: '.min'}))                                   
        .pipe(minifycss())                                                
        .pipe(gulp.dest('assets/css/'))                                   
        .pipe(livereload());                                              
        util.log(util.colors.yellow('Sass compiled & minified'));         
});

Answer 2

您是否尝试过添加'bower_components/foundation/scss/foundation/foundation.scss'来源？这是包含所有@import的基础的文件。

使用Gulpjs编译Zurb Foundation部分内容

2 个答案: