4

我想在我的节点应用程序中使用 autoprefixer 来编译 css。对于我的特定需求,我想在没有回调或承诺的情况下调用 autoprefixer。

很简单:

var result = autoprefixer.process(css);

或者

var result = myPrefixerWrap(css);

我正在为此奋斗一段时间,请您帮帮我。

谢谢你

ps:我已经尝试过 postcss-js,但它产生了一个 json 对象供反应使用,而不是纯 css。例如 {borderRadius:"5px"}

var prefixer    = postcssJs.sync([ autoprefixer ]);
var cssCompiled = postcss.parse(css);
var cssObject   = postcssJS.objectify(cssCompiled);
var autoResult  = prefixer(cssObject);
4

1 回答 1

7

PostCSS 有一个 API 用于同步获取Processor#process( process().css,别名为) 的结果toString(),只要所有使用的 PostCSS 插件都是同步的(如 Autoprefixer),它就可以工作。执行此操作的代码非常简单:

var postcss = require('postcss'); // import postcss from 'posts';
var autoprefixer = require('autoprefixer'); // import autoprefixer from 'autoprefixer';
postcss([autoprefixer]).process(styleString).css;

注意:我在 Webpack 中使用 postcss-js 时遇到了问题,所以对于那些看到如下错误的人:

Module parse failed: /path/to/node_modules/autoprefixer/node_modules/caniuse-db/features-json/css-regions.json Line 2: Unexpected token :
You may need an appropriate loader to handle this file type.

或者:

ERROR in ./~/autoprefixer/~/browserslist/index.js
Module not found: Error: Cannot resolve module 'fs' in /path/to/node_modules/autoprefixer/node_modules/browserslist
 @ ./~/autoprefixer/~/browserslist/index.js 3:14-27

查看 postcss-js GitHub 自述文件的疑难解答部分,了解需要添加到 Webpack 配置以使其正常工作的内容。

于 2016-04-07T00:02:54.313 回答