NervJS / taro-ui

一款基于 Taro 框架开发的多端 UI 组件库
https://taro-ui.taro.zone
MIT License
4.52k stars 756 forks source link

taro项目designWidth: 390, taro-ui 所有组件都无法自适应缩放了. #1813

Open zqjia-github opened 2 weeks ago

zqjia-github commented 2 weeks ago

问题描述 taro项目designWidth: 390, taro-ui 所有组件都无法自适应缩放了.

复现步骤

  1. 设计师提供的原型图是 390 尺寸;
  2. 配置项目config/index.js; designWidth: 390, deviceRatio: { 640: 2.34 / 2, 750: 1, 375: 2, 390: 3.85 / 2, 828: 1.81 / 2, }
  3. 引入taro-ui后, 缩放比例不对了, 所有组件直接放大了两倍左右;

期望行为

能够提供解决方案, 目前尝试过全局修改scss变量 $hd: 1; 仅能解决文字大小问题, 组件中的其他属性都还是放大后的效果

系统信息

Taro 版本 3.6.14 Taro 版本 3.3.0 出问题的平台: weapp 补充信息

taro-ui-bot[bot] commented 2 weeks ago

欢迎提交 Issue~

如果你提交的是 bug 报告,请务必遵循 Issue 模板的规范,尽量用简洁的语言描述你的问题,最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足,或者已经其他 issue 已经存在相关内容,你的 issue 有可能会被关闭。

Good luck and happy coding~

zhangbingjie-uu commented 3 days ago

请问你的问题解决了吗,我根据网上办法安装了postcss-px-scale插件,依旧没有解决问题

designWidth(input) {
      if (input?.file?.replace(/\\+/g, "/").indexOf("taro-ui/dist") > -1) {
        return 750;
      }
      return 375;
    },

    deviceRatio: {
      640: 2.34 / 2,
      750: 1,
      828: 1.81 / 2,
      375: 1 / 2,
    },

"postcss-px-scale": {
          enable: true,
          config: {
            scale: 0.5, // 缩放为 1/2
            units: "rpx",
            includes: ["taro-ui"],
          },
        },