Question

现在，我目前正在一个项目中，我必须支持ie10的flexbox，我试图通过终端独立为我的一些CSS代码自动添加前缀。

该项目不支持gulp或webpack等任何构建工具。

因此，我已经如下安装了postcss和autoprefixer：

npm install -g postcss autoprefixer

然后我试图像这样自动为单个文件添加前缀：

npx postcss --use autoprefixer --autoprefixer.flexbox --autoprefix.browser "> 0%" -o main.css test.css

它适用于我的大多数代码，但在ie10中不包含flexbox的任何前缀。

我做错什么了吗？

Answer 1

您要调用的cli命令用于postcss-cli-simple，而不是 postcss 本身或 postcss-cli

要使用您的命令，您必须安装此软件包

npm install postcss-cli-simple autoprefixer

然后可以使用此命令

./node_modules/.bin/postcss --use autoprefixer --autoprefixer.browsers "ie 10" -o main.css test.pcss

此命令将转换为：

body {
  display: flex;
  flex: 1 0 calc(1vw - 1px);
}

进入

body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 0 calc(1vw - 1px);
      flex: 1 0 calc(1vw - 1px);
}

Answer 2

尝试使用 .browserslistrc 文件

last 20 versions