vue移动端适配

axdbk / 2023-07-30 / 原文

1.安装
npm add postcss-pxtorem@5.1.1 amfe-flexible -S

  amfe-flexible是可配置可伸缩布局方案,主要是将1rem设为viewWidth/10。
     postcss-pxtorem是postcss的插件,用于将像素单位生成rem单位

2.在vue.config.js中引入

module.exports = {
     css: {
         loaderOptions: {
             postcss: {
                 plugins: [
                     require('postcss-pxtorem')({
                         rootvalue: 16,
               propList: ['*'] }) ] } } }, }

3.在main.js中引入  

import 'amfe-flexible';