Gulp任务:从管道吞咽到postCSS什么都不做

Question

我试着：

1. 将供应商前缀添加到SCSS
2. 编译到CSS
3. 中，将

缩小。

使用这个吞咽代码：

const {src,dest} = require('gulp');
const sass = require('gulp-sass')(require('sass'));
const autoprefixer = require('autoprefixer');
const sourcemaps= require('gulp-sourcemaps');
const postcss = require('gulp-postcss')
const postcssScss = require('postcss-scss') 

function genCSS() {
  return src(tpath.src.scss)
    .pipe(sourcemaps.init()) //line in css, maps to source (file & line).
    .pipe(postcss({plugins:[autoprefixer()], syntax:require('postcss-scss')}))
    .pipe(sass.sync({outputStyle:'compressed'}).on('error', sass.logError))
    .pipe(sourcemaps.write())
    .pipe(dest(tpath.dest.scss)) //single index.css file
};

exports.genCSS=genCSS

但这就是postCSS记录的内容，而且确实是这样的：

您没有设置任何插件、解析器或字符串。现在，PostCSS什么也不做。在https://www.postcss.parts/上为您的情况选择插件，并在postcss.config.js中使用它们。

在链接的页面上：https://www.postcss.parts/，有Sass插件，但这不是一个编译器，所以我很困惑。

什么是错误，如何解决？

Answer 1

这

  .pipe(postcss([autoprefixer()],{syntax:'postcss-scss'}))

应：

    .pipe(postcss([autoprefixer()],{syntax:'postcss-scss'}))

以下是一些细节：

如果存在Config文件，则删除postcss({...})

• It中的选项，如果没有函数参数上的postcss-scss，则运行得更快(但必须导入它)，如：

。

const postcssScss = require('postcss-scss') //keep this

.pipe(postcss([autoprefixer()])) //removed here

您可以添加、cssnano并删除outputStyle:compressed，但是这会慢一些(加载额外的包)。