webstrom 配置 postcss 设置 css 前缀

<!--
CSS前缀
- 一些浏览有时会在浏览器中添加一些尚未成为标准的属性
为了避免这些属性不会和将来的标准产生冲突，所以浏览器一般会为这些非标准的属性添加浏览器的前缀
-moz- 火狐
-webkit- chrome
-ms- 微软
...

- 使用postcss来辅助我们添加CSS的前缀
安装postcss-cli
// cnpm i -g postcss-cli
npm install postcss-cli@6.1.3 -g

- autoprefixer 是 postcss中的插件，专门用来为css添加前缀

// cnpm i -g autoprefixer
npm install autoprefixer@9.8.6 -g

postcss 源文件.css -u autoprefixer -o 目标文件.css
postcss test.css -u autoprefixer -o test22.css

- caniuse.com 查询css属性的兼容性
- https://github.com/postcss/postcss-cli
- https://github.com/postcss/autoprefixer#cli
-->

 

 

 

 

 

name autoprefixer

C:\Users\[用户名]\AppData\Roaming\npm\postcss
C:\Users\Eric\AppData\Roaming\npm\postcss

-u autoprefixer -o $FileDir$\$FileName$ $FileDir$\$FileName$

$ProjectFileDir$