地图吞咽。多维数组上的任务

项目信息

我正在开发scss,并使用gulp编译文件。

然后在我的gulpfile中声明一个包含所有前端样式表的数组和另一个包含后端样式表的数组。以下是目前的情况。但它还没有结束。

const cssFront     = [ 'style.scss' ];
const cssBack      = [ 'admin.scss', 'settings.admin.scss' ];
let cssFiles       = [ cssFront, cssBack ];

Gulp现在应该映射到中的所有文件 cssFiles

我所做的

map

const sass         = require( 'gulp-sass' );
const autoprefixer = require( 'gulp-autoprefixer' );

const styleSRC     = './src/scss/';
const cssFront     = [ 'style.scss' ];
const cssBack      = [ 'admin.scss', 'settings.admin.scss' ];
let cssFiles       = [ cssFront, cssBack ];
const styleURL     = './assets/css/';
const mapURL       = './';

gulp.task( 'scss', function() {
    cssFiles = cssFiles.reduce(function(a, b){
        return a.concat(b);
    });

    cssFiles.map( function( file ) {
        return gulp.src( styleSRC + file )
        .pipe( sourcemaps.init() )
        .pipe( sass({
            errLogToConsole: true,
            outputStyle: 'compressed'
        }) )
        .on( 'error', console.error.bind( console ) )
        .pipe( autoprefixer({ browsers: [ 'last 2 versions', '> 5%', 'Firefox ESR' ] }) )
        .pipe( rename( { suffix: '.min' } ) )
        .pipe( sourcemaps.write( mapURL ) )
        .pipe( gulp.dest( styleURL ) )
        .pipe( browserSync.stream() );
    });
});

问题

reduce -功能运行良好。我做了一个 console.log 输出为:

['style.scss', 'admin.scss', 'settings.admin.scss']

$ gulp scss )这段代码运行得很好,所有文件都编译并保存在 assets/css/ $ gulp watch ,我收到一条错误消息,说

CSS文件。地图不是一个函数

gulp.task . 如果有人能帮我解决这个问题,我将非常高兴。