Taro开发微信小程序应该使用什么尺寸单位

公司使用的是Taro vue开发微信小程序，请问在画页面的时候应该使用什么尺寸单位？同时蓝湖的设计稿右侧的开发平台应该怎么选择呢？

img

个人感觉正常px就行 和设计图保持一致即可。

印象中记得以前做的时候好像有个二倍的关系，不知道啥原因 你可以试下 写个100px 看预览效果和设计稿一致吗。

另外如果要编译成h5的话 可能得配合rem做一些自适应。编译小程序有rpx可以自适应。h5好像不行。

另外，如果是新工程，可以换下技术选型，uniapp对vue的支持更友好一点。taro是react

对于使用 Taro 框架开发微信小程序,有以下建议:

  1. 尺寸单位选择px。Taro 框架默认使用px作为长度单位,它会自动转换为小程序端的rpx。所以在编写微信小程序时,建议使用px作为长度单位。

  2. 蓝湖设计稿选择“微信小程序”作为开发平台。这样蓝湖会输出以750px宽度的设计稿,并配套输出微信小程序端所需要的尺寸单位(rpx)的标注文件。

  3. 设计稿采用750px宽度。由于微信小程序的视觉标准是750px,所以设计稿选择这个宽度可以精准还原设计效果。Taro也是基于此做转化的。

  4. 查看蓝湖转换后的rpx标注文件。蓝湖会给出设计稿在微信小程序端的具体rpx尺寸,你需要根据这份标注来在代码中使用正确的rpx尺寸。

举个例子,如果设计稿上某元素的宽是120px,则:

  • 在Taro代码中,你仍使用120px作为宽度:

jsx
<View style={{width: 120px}} />

  • 蓝湖的rpx标注文件会给出这个元素在微信小程序端的rpx宽度,比如160rpx

  • Taro会自动将120px转换为160rpx,以实现在微信小程序端的正确显示

  • 你只需要关注Taro代码使用px,而参考蓝湖标注的rpx数值即可

所以,对你的问题总结为:

  1. 代码使用px单位
  2. 蓝湖设计稿选择微信小程序,宽750px
  3. 参考蓝湖生成的rpx标注文件,来了解实际显示的rpx尺寸

希望这些信息能帮助到你

推荐使用px或者百分比，当然使用px会进行转换，具体配置如下
https://blog.csdn.net/m0_74433188/article/details/129817873

在使用 Taro vue 开发微信小程序时，可以使用 rpx（responsive pixel）作为尺寸单位。rpx 是一个相对单位，可以根据屏幕宽度进行自适应，使得页面在不同屏幕大小的设备上展示更加统一和美观。具体来说，1rpx 相当于屏幕宽度的 1/750。

对于蓝湖的设计稿右侧的开发平台，应该选择 Taro 小程序开发平台，以保证设计稿的适配性和准确性。在 Taro 小程序开发平台中，可以设置不同的设备类型和屏幕尺寸，进行预览和测试，帮助开发者更好地完成小程序页面的开发和调试。