Vant: 与vw适配不兼容

Created on 27 Apr 2018  ·  9Comments  ·  Source: youzan/vant

使用大漠的vw方案适配,默认单位宽高都失效,目前只支持rem适配嘛

Most helpful comment

cube那边使用postcss-design-convert 解决的
我这边尝试了下 也可以解决适配

'postcss-design-convert': { multiple: 2, units: ['vw'], selector: /^\.van-/ }

All 9 comments

具体不兼容的地方是?

默认宽高样式没有了

好像确实有这个问题,转成vw后高度变得异常矮。

postcss-px-to-viewport 设置不编译 'van'

postcss-px-to-viewport 设置 selectorBlackList: [/van-\w+/,/base-\w+/] 把van-的样式都过滤掉就可以了

我不明白过滤后,意义何在!过滤后,px单位没有转成vw,那么适配的意义就没有了哇

我不明白过滤后,意义何在!过滤后,px单位没有转成vw,那么适配的意义就没有了哇

vw 适配的是你自己的代码,vant 的样式一直是正常的

我不明白过滤后,意义何在!过滤后,px单位没有转成vw,那么适配的意义就没有了哇

vw 适配的是你自己的代码,vant 的样式一直是正常的

是的,我现在是使用 postcss-px-to-viewport 对所有px 都进行了 vw转换!假设如果我使用了vant 组件 button,如果不对vant ui button 的样式也转成vw的话,会不会不够优雅呀。就是在适配上。

不过其实我现在遇到个问题,vant 的样式已经全部转成vw了,但是假如我按照750的设计稿的话,vant 的单位长度并没有扩展成2倍的基数....

cube那边使用postcss-design-convert 解决的
我这边尝试了下 也可以解决适配

'postcss-design-convert': { multiple: 2, units: ['vw'], selector: /^\.van-/ }

Was this page helpful?
0 / 5 - 0 ratings