解决uniapp vue3版本，cli脚手架项目编译到app平台后，模板中rpx不生效，但是在css中写rpx生效bug

项目场景：

项目场景：uniapp vue3版本，cli脚手架项目编译到app平台后，模板中rpx不生效，但是在css中写rpx生效bug

---

问题描述

例如：在写样式的过程中，发现在template中写rpx单位在浏览器上正常，但是编译到app之后，rpx单位会以px的方式渲染，导致样式不一致，例如以下示例：

<view style="width:375rpx;background-color:red;">test</view>

按照预期结果来说，375rpx会占屏幕的宽度一半，但实际渲染效果根据px渲染，结果占了一大半

原因分析：

xdm真就大无语事件，我找了很久的问题，一个个文件排查，各种配置排查，最后才查到是版本问题，我原先版本如下

 "dependencies": {
    "@dcloudio/uni-app": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-app-plus": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-components": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-h5": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-alipay": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-baidu": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-kuaishou": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-lark": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-qq": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-toutiao": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-mp-weixin": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-quickapp-webview": "3.0.0-alpha-3061620221230002",
  },
  "devDependencies": {
    "@dcloudio/types": "^3.2.7",
    "@dcloudio/uni-automator": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-cli-shared": "3.0.0-alpha-3061620221230002",
    "@dcloudio/uni-stacktracey": "3.0.0-alpha-3061620221230002",
    "@dcloudio/vite-plugin-uni": "3.0.0-alpha-3061620221230002",
  }

---

解决方案：

去uniapp官网中，vue脚手架创建教程中，去gitee下载最新的模板，把@dcloudio相关依赖复制到package.json中，替换原先的版本，删掉node_modules重新安装，如果有package-lock.json或者yarn.lock的，把lock文件和node_modules一起删掉。