# posttcss
* postcss可以和很多构建工具相结合，也有自己的cli: npm i postcss-cli
* 课程已久，postcss-cli 高版本的API: https://www.npmjs.com/package/postcss-cli
* ./node_modules/.bin/postcss a.css命令需要Linux的终端, windows下npx postcss或全局安装
* npx postcss a.css --no-map 默认不添加sourcemap
* postcss完全靠插件玩, 配置文件 postcss-config.js
## autoprefixer
* npm i autoprefixer
* 新版配置项也不同: http://www.mamicode.com/info-detail-2746932.html
* 指定兼容浏览器范围的数据来源: caniuse.com
## postcss-import
* cnpm i postcss-import
* 原生 @import css; 会多一次http请求
* ./node_modules/.bin/postcss src/02-plugins-main.css -o build/02-plugins-main.css --no-map
## cssnano
* cnpm i cssnano
* cssnano 一般放在最后
* 合并两个css中的.box{} .boxP{}(包括@import css文件中的.box); 压缩成min.css; 多个main属性压缩成简写;
## 还有很多插件, 看文档啦
## cssnext
* 已经形成了自己的一套语法系统
* 把一些规范中已经提出来的已经定稿的还没有实现的东西，现在就用起来
* 跟我们用babel browserfiy使用es6 7..一样的原理
css面试技巧课程中 PostCSS.zip
需积分: 0 5 浏览量
2024-03-16
22:30:09
上传
评论
收藏 46KB ZIP 举报
css面试技巧课程中 PostCSS.zip （37个子文件） 
654 postcss-plugin-demo-in-webpack 
webpack.config-01-使用插件.js 602B webpack.config.js 129B src 01-postcss.css 298B 04-precss.css 268B 06-webpack-css.css 22B 05-webpack-module.js 82B 03-cssnext.css 161B 06-webpack-main.js 71B 05-webpack-main.js 63B 02-plugins-main.css 295B 02-plugins-module.css 74B build 06-webpack-main.js 12KB 05-webpack-main.js 3KB
index.html 346B README.md 1KB postcss-plugin-demo-in-gulp gulpfile.js 465B src 01-postcss.css 84B 04-precss.css 268B 03-cssnext.css 161B 02-plugins-main.css 186B 02-plugins-module.css 46B postcss.config.js 456B build 02-plugins-main.css 124B package-lock.json 79KB README.md 666B postcss-plugin-demo src 01-postcss.css 298B 04-precss.css 268B 03-cssnext.css 161B 02-plugins-main.css 295B 02-plugins-module.css 74B build 02-plugins-main.css 303B package-lock.json 35KB index.html 263B README.md 1KB postcss.config.js 518B .gitignore 60B README.md 27B资源评论
