通过两个插件来实现  postcss-pxtorem和  amfe-flexible 在main.js中导入import"amfe-flexible";在vite.config.js中配置css:{postcss:{plugins:[postcssPxtoRem({rootValue:192,//根据使用的ui组件？定义根元素大小？

当我们添加完vant组件库后，还需要对项目的移动端进行适配执行 yarnaddamfe-flexible 安装 amfe-flexible安装完成后我们在main.js 中配置 动态设置rem基准值然后通过执行 yarnaddpostcss-pxtorem-D 把  postcss-pxtorem 安装到开发环境中在项目根目录中

1、安装插件npmipostcss-pxtorem-D2、与package.json同级目录创建postcss.config.js文件module.exports={plugins:{autoprefixer:{overrideBrowserslist:["Android4.1","iOS7.1",

1、项目搭建2、安装插件npminstallamfe-flexible--savenpminstallpostcss-pxtorem--save-dev3、引入插件import'amfe-flexible'//main.ts4、vite.config.ts配置import{defineConfig}from'vite'importpostCssPxToRemfrom'postcss-pxtore

1，安装 amfe-flexible npminstall amfe-flexible --save-dev  2,安装  [email protected]  3，vue.config.js中添加配置 css:{  loaderOptions:{   postcss:{    plugins:[     

1.安装[email protected]是可配置可伸缩布局方案，主要是将1rem设为viewWidth/10。  postcss-pxtorem是postcss的插件，用于将像素单位生成rem单位。2.在vue.config.js中引入module.exports={css:{lo

vue适配1.amfe-flexibleamfe-flexible是配置可伸缩布局方案，主要是将1rem设为viewWidth/10。2.postcss-pxtorempostcss-pxtorem是postcss的插件，用于将像素单元生成rem单位。先安装amfe-flexible和postcss-pxtoremnpminstallamfe-flexible--savenpminstallpostcss-pxto

安装amfe-flexiblenpminstallamfe-flexible-S安装px2rem-loadernpminstallpx2rem-loader-D在mian.js中引入import'amfe-flexible'在vue.config.js中配置module.exports={chainWebpack:config=>{config.module.rule('scss&#

vantrem适配，需要安装两个插件postcss-pxtorem 是一款postcss插件，用于将单位转化为rem  lib-flexible 用于设置rem基准值postcss-pxtorem：npminstallpostc

如果使用Vue进行移动端页面的开发，需要对不同机型的宽高进行适配。最常用的方法是使用amfe-flexable和postcss-pxtorem这两个插件来帮助进行适配。amfe-flexableamfe-flex

下载安装：npmi-Samfe-flexiblegw：GitHub-amfe/lib-flexible:可伸缩布局方案 下载2个第三方包即可实现移动端适配amfe-flexible是配置可伸缩布局方案，主要是将1

1.安装amfe-flexible（根据屏幕动态改变根元素font-size，postcss-pxtorem把代码中px转为rem）npmiamfe-flexible-S2.安装postcss-pxtorem（一款PostCSS插件，用于将px单位转