Taro设计尺寸

1. Taro 默认会对所有单位进行转换。在 Taro 中书写尺寸按照 1:1 的关系来进行书写，即从设计稿上量的长度 100px，那么尺寸书写就是 100px，当转成微信小程序的时候，尺寸将默认转换为 100rpx，当转成 H5 时将默认转换为以 rem 为单位的值。所以建议使用px或者%。
2. 如果我们不需要将尺寸进行转化，可以将px写成PX或者Px。此时class ignore在转化时将会被忽略。

.ignore {
  border: 1Px solid; // ignored
  border-width: 2PX; // ignored
}

3. taro换算尺寸的标准是750px，如果我们需要修改默认尺寸，则需要将config/index.js中的尺寸进行修改。将config中的designWidth修改为我们想要的默认尺寸。

designWidth: 750，

4. 换算规则如下，将DEVICE_RETIO中的内容修改，此时默认为750px，即iphone6的尺寸。

const DEVICE_RATIO = {
  '640': 2.34 / 2,
  '750': 1,
  '828': 1.81 / 2,
  '375': 2 / 1
}

5. taro的尺寸转化API，小程序rpx，h5rem。

Taro.pxTransform(10)

6. 配置的参考转换规则，PX或者Px不参与转化

{
  onePxTransform: true, 1px是否发生转化，值为布尔类型
  unitPrecision: 5, rem允许的小数位，值为number类型
  propList: ['*'], 允许转化的属性，设置为*则代表任意['!font']
  selectorBlackList: [],黑名单中的选择器将会被忽略
  replace: true, 直接替换而不是追加一条进行覆盖，值为布尔类型
  mediaQuery: false, 允许媒体查询中的px进行单位转化，值为布尔类型
  minPixelValue: 0 设置一个可以被转化的最小值
}

7. 对于头部包含注释 /postcss-pxtransform disable/ 的文件，插件不予处理。
8. 忽略样式方法

1.加入css注释强制声明忽略下一行。
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;

1.加入css注释强制声明忽略下一行。
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;

2.加入css注释强制声明注释中间多行
/* autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

3.写成行内样式
<View 
  style={{
    display: '-webkit-box',
    '-webkit-box-orient': 'vertical',
    '-webkit-line-clamp': 2,
    'text-overflow': 'ellipsis',
    overflow: 'hidden',
    'line-height': 2
  }}
>
  这是要省略的内容这是要省略的内容这是要省略的内容
</View>