Vite3 + Vant + vue3 + ts H5页面的基础配置

1. 使用vite3构建好基础项目后，npm 以下几个插件：

npm install postcss postcss-pxtorem amfe-flexible autoprefixer --save
npm i @vant/auto-import-resolver unplugin-vue-components unplugin-auto-import @types/node -D

        插件说明：

文章参考来源：移动端适配

postcss-pxtorem是PostCSS的插件，用于将像素单元生成rem单位。

前端开发还原设计稿的重要性毋庸置疑，目前应用的单位最多还是rem,然而每次在制作过程中需要自己计算rem值，为了能够直接按照设计图的尺寸开发，并且能自动编译转换成rem，下面就来分享下postcss-pxtorem的使用。

介绍amfe-flexible
amfe-flexible是配置可伸缩布局方案，主要是将1rem设为viewWidth/10。

autoprefixer介绍

Autoprefixer是一款自动管理浏览器前缀的插件，可以解析css文件并且添加前缀到css内容里，使用Can I Use(caniuse网站)的数据决定哪些前缀是需要的。该插件css解析器采用postcss，使用Browserslist库，可以对浏览器的版本做精确设置。

文章参考来源：