Gulp将多个css文件编译成一个

Question

我有两个文件main.css和_vars.css，我正在使用PostCSS。我还在学习PostCSS的不同插件和设置，但是我对Gulp也很新，所以我在编写css文件时遇到了问题。

我想阅读，main.css和_vars.css然后将它们编译成

./bundle/stylecss/到名为main.css的文件中。

  gulp.task('css', function () {
     return gulp.src('./postcss/**/*.css')
        // .pipe(postcss([ vars({ variables: colors }) ]))
        .pipe(postcss([ require('postcss-simple-vars')({ silent: true }) ]))
        .pipe(gulp.dest('./bundle/stylescss/main.css'));
});

我的gulp文件在上面，但当我运行我的gulpfile时，我得到了

任何想法我做错了什么？谢谢！

Answer 1

您可以使用gulp插件或postcss插件来执行此操作。

gulp插件：https://www.npmjs.com/package/gulp-concat

postcss插件：https://github.com/postcss/postcss-import

我更喜欢使用postcss插件，因为它不那么神奇，但要么就能完成这项工作：）