vite天生对postcss有非常良好的支持
全屋净水系统有一个了解
水龙头里来的水是自来水
自来水 从 管道里 先到这个全屋净水系统 给全屋净水系统做一些插槽 ---> 去除砂砾 --> 净化细菌微生物 ---> ... --> 输送到水龙头 --> 我们可以喝的纯净水 (为了保证到我们嘴里喝的水是万无一失)
postcss 他的工作基本和全屋净水系统一致: 保证css在执行起来是万无一失的
都对postcss有一个误区: 他们认为postcss和less sass是差不多级别
我们写的css代码(怎么爽怎么来) --> postcss ---> less --> 再次对未来的高级css语法进行降级 --> 前缀补全 --> 浏览器客户端
目前来说 less和sass等一系列预处理器的postcss插件已经停止维护了 less插件 你自己去用less和sass编译完了, 然后你把编译结果给我
所以业内就产生了一个新的说法: postcss是后处理器 less的postcss的插件就ok了
我们写的js代码(怎么爽怎么来) --> babel --> 将最新的ts语法进行转换js语法 --> 做一次语法降级 --> 浏览器客户端去执行
babel --> 帮助我们让js执行起来万无一失
class App {} // es6的写法
function App() {} // es3的语法
浏览器的兼容性你能考虑到吗, 预处理器并不能够解决这些问题:
- 对未来css属性的一些使用降级问题
- 前缀补全: Google非常卷 --webkit
- 安装依赖
yarn add postcss-cli postcss -D
- 书写描述文件
postcss配置文件的格式
- postcss.config.js