Webpack 5 + Vue 2

一、兼容性处理

browserslistrc

1. 如何实现兼容

browserslist 仅仅提供需要兼容的平台的版本限制，处理兼容性的插件则受限于这个版本限制，例如 Bable，postcss-preset-env 等插件。

2. 兼容那些平台

兼容平台可以通过 caniuse.com 进行查看，点击底部 Browser usage table 查看浏览器每个版本占有率。browserslist 由 Webpack 自动安装，可使用 npx browserslist 查看，该模块就是引用 caniuse.com 统计出的占有率进行判断。配置方法：在 package.json 中新加 browserslist 属性，值为数组。也可以新建.browserslistrc文件。

postcss 的兼容处理使用

1. postcss做了什么

postcss 其实就是给css代码添加前缀，使css代码兼容各个平台，postcss用postcss-loader 的方式 添加在rules中的.css的解析中。postcss 本身不会给 css 添加前缀，还需使用配套的插件去完成，例如 autoprefixer （添加前缀的插件），postcss-preset-env（postcss所有插件的集合，包括autoprefixer）

1. postcss怎么用

安装 postcss-loade