建议保留 px 尺寸单位的原义

[liamwang]

建议保留 px 尺寸单位的原义，不要自动将其转换为对应的 rpx 或 rem。

以下是原因：

1. px 是最基本的尺寸单位，尽管是移动端开发，px 的使用频率也很高，比如 font-size 大部分场景都是以 px 作为单位。

2. 改变了 px 单位的原义，代码的可阅读性会有所降低。因为字面上的 10px 要在脑海中理解为 10 rpx/rem。

3. Taro 对 px 单位转换的忽略规则是首字母大写：Px 或 PX，但有的格式化工具会将其格式化为全部小写的 px，比如 VS Code 中的 Prettier（我想应该可以通过设置将此自动转换关闭）。

4. 需要通过文档才能了解到 px 单位会被自动转换为其它单位及其忽略规则，增加了不必要的学习成本（当然这点学习成本也是可以忽略不记的）。

我的建议：

px 尺寸单位保留原义。如果要使用响应式单位，统一用 rpx（或 xpx），Taro 自动将其转换为 rpx 或 rem。

寻求帮助：

VS Code 中的 Prettier 格式化时会将 css/scss 的属性值全部转换为小写，这样致使我无法使用Px或PX。目前我还没有找到关闭自动转小写的设置，有谁知道吗？麻烦告知我一下，非常感谢！

[taro-bot]

欢迎提交 Issue~

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

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

Good luck and happy coding~

[liamwang]

另外，非常感谢 Taro 这个优秀的项目和背后辛苦付出的团队，目前使用下来，小程序/H5多端统一开发体验非常棒！

[luckyadam]

px 自动转换适配是一种约束，这个看你如何去理解，我们的初衷是希望能够提供一套更简易的尺寸适配规则，px 的转换适配是目前看来最简单的，因为你可以从设计稿量得多少 px 就写多少 px，跟开发 PC 时代的页面一样，所以我认为这并没有改变 px 的原义。

[liamwang]

@luckyadam

那能否在下一版本对 px 自动转 rpx/rem 增加一个忽略规则？比如使用 opx （original px） 代表使用 px 原义，Taro 将自动转换为 px。因为 Prittier 这样的格式化工具目前对 css 属性值全部转小写并没有提供开关，只能禁用它或改用 Beautify 才能避免Px/PX自动转换为 px。我暂时改用了 Beautify 作为格式化工具。

或者有没有更好的方案呢？

[luckyadam]

@liamwang
忽略规则已经有了，不仅仅是 PX
https://nervjs.github.io/taro/docs/size.html

[liamwang]

@luckyadam 谢谢。

[imageslr]

我也遇到这个问题，只能写在prettier换成beautify @liamwang

[chen-can]

prettier/prettier#3077
解决了必须使用，注意注释区域只对当前行数有效
a {
/ * prettier-ignore * /
font-size：16 PX ;
}

[yuxino]

有个很简单的办法. 写 #{"1PX"} 就好了。 这样prettier不会转换掉这个字符。

sass 也会正确的读出来。

border: #{"1PX"} solid pink;

sass interpolation

[William-WFC]

vscode settings.json里添加如下设置，可以避免自动转换
"vetur.format.defaultFormatter.css": "none", "vetur.format.defaultFormatter.scss": "none", "vetur.format.defaultFormatter.less": "none", "[vue]": { "editor.defaultFormatter": "octref.vetur" },