我想在我的 Node 应用程序中使用 autoprefixer 来编译 css。 对于我的特定需求,我想在没有回调或 promise 的情况下调用 autoprefixer。
很简单:
var result = autoprefixer.process(css);
或
var result = myPrefixerWrap(css);
我为此苦苦挣扎了一段时间,你能帮帮我吗?
ps:我已经尝试过 postcss-js,但它产生了一个用于 react 使用的 json 对象,而不是纯 css。例如 {borderRadius:"5px"}
var prefixer = postcssJs.sync([ autoprefixer ]);
var cssCompiled = postcss.parse(css);
var cssObject = postcssJS.objectify(cssCompiled);
var autoResult = prefixer(cssObject);
最佳答案
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
查看 Troubleshooting section postcss-js GitHub 自述文件,了解您需要添加到 Webpack 配置以使其正常工作的内容。
关于css - 同步使用自动前缀,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35943597/