如何从 node-sass 获取输出到 postcss autoprefixer

Question

如何使用 node-sass 的输出通过 postcss autoprefixer。

我不打算使用任何 webpack 或 gulp。

我纯粹使用节点包中的 cli

这是我当前的 npm 脚本

node-sass --watch ./src/scss --output ./dist/assets/css | postcss ./dist/assets/css/app.css --use autoprefixer --output ./dist/assets/css/app-dist.css

只有当我以不同的名称输出到同一个文件夹时，一切才有效。但是如果我想输出到相同的名称，它就不起作用。

所以流程是 scss -> css -> autoprefixer ->compiled.css

Answer 1

There is no node-sass api available that would allow you to do this through cli I think.

I ended up running node-sass-chokidar and postcss in parallel, with an intermediate temp file created by node-sass, its not pretty but it gets the job done:

node-sass-chokidar ./root.scss ./tmp/root.css --watch --source-map-embed --source-map-root file://${PWD}/ &
P1=$ postcss -w ./tmp/root.css -o ./a-very-long-path-lalala/root.css &
P2=$! wait $P1 $P2

This allows you to terminate both with ctrl+c. Also you can move your scripts to a external file using i.e. scripty so you package.json scripts stay reasonably short.

Also you could consider using gulp or grunt.