Gulp sass не компилирует цикл for с тегом #{$i}

Возникла проблема с Gulp sass, он не компилирует мой файл.

Unknown word You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

CSS-код:

@for $i from 1 through 12 {
    .col-#{$i} {
        -ms-flex-preferred-size: (100% / 12) * $i;
        -webkit-flex-basis: (100% / 12) * $i;
        flex-basis: (100% / 12) * $i;
        max-width: (100% / 12) * $i;
    }
}

Глоток кода:

gulp.task( 'sass', function() {
    return gulp.src( SOURCEPATHS.sassSource )
        .pipe( autoprefixer({ browsers: ['last 2 versions']} ) )
        .pipe( sass({ includePaths: ['node_modules'] }, { outputStyle: 'compressed' }).on('error', sass.logError) )
        .pipe( mmq({ log: false }) )
        .pipe( cssmin() )
        .pipe( rename({suffix: '.min'}) )
        .pipe( gulp.dest(APPPATH.css) );
});

Ошибка с этим тегом #{$я} - без этого - gulp скомпилирует css файл.

Может быть проблема? Я много читал о gulp-postcss - и попробовал с ним, но результат тот же - ОШИБКА