PC+大屏可适配1400px以上屏幕查看demo项目地址设置设计稿-转换rem我们的设计稿宽度为3840px,所以设置了widthOfDesignLayout到3840模块。exports={plugins:{autoprefixer:{},"@njleonzhang/postcss-px-to-rem":{unitToConvert:"px",widthOfDesignLayout:3840,//设计稿的宽度为设计的UI宽度unitPrecision:3,//小数单位。selectorBlackList:[".ignore",".hairlines"],//过滤那些不需要转换的类minPixelValue:1,//设置要替换的最小像素值。mediaQuery:false,//允许在媒体查询中转换px},},};设置main.js下根节点的字体,在屏幕缩放的过程中也要保证16:9的比例,勾选这个插件constdashboardFlexible=require('lib-flexible-for-dashboard');dashboardFlexible.init(16/9)开发设计尽可能多的给按钮{width:465px;height:112px;}手机+ipad适配可适配手机+ipaddemo地址项目地址转换remcss:{loaderOptions:{postcss:{plugins:[require("postcss-pxtorem")({rootValue:75,//conversionbase1rem=75px这个是根据750px的设计稿,如果是620就写62//Ignoretransformregex该插件将转换px中的所有样式。比如引入三方UI也会进行改造。目前我使用selectorBlackList字段来过滤//如果有些地方不想转换px。您可以简单地使用大写PX或Px。selectorBlackList:['van-'],propList:["*"],//需要转换的属性,如`hight`,`width`,`margin`等,`*`表示全部}),],},},},设置根节点的字体import'lib-flexible'开发设计给750px的设计稿填多少,比如这个框的高度是96px,就这样写直接96px设计稿。高度:72px;背景:rgba(238,238,238,0.5);边界半径:36px;其他解决方案大屏数据可视化-屏幕适配解决方案(多分辨率下
