hbuilderX 3.8.12 构建项目输出代码与cli 3.8.12存在差异 uni-app hx中点击发布H5 tsconfig 的 useDefineForClassFields 未生效

hbuilderX 3.8.12 构建项目输出代码与cli 3.8.12存在差异 uni-app hx中点击发布H5 tsconfig 的 useDefineForClassFields 未生效

示例代码:

<script lang="ts" setup>  
import { onReady, onLoad } from '@dcloudio/uni-app'  
class A {  
  private a: string  
  public b: string  
  c: string  
  constructor() {  
    this.a = undefined  
    this.b = undefined  
    this.c = undefined  
  }  
}  
class B {  
  private a: string  
  public b: string  
  c: string  
}  
onLoad(() => {  
  // 期望结果: { a: undefined, b: undefined, c: undefined }  
  console.log(new A()) // 运行结果: {}  
  console.log(new B()) // 运行结果: {}  
})  
</script>

操作步骤:

  • 编写一个class,并实例化
class B {  
  private a: string  
  public b: string  
  c: string  
}  
// 期望结果: { a: undefined, b: undefined, c: undefined }  
console.log(new A()) // 运行结果: {}

预期结果:

console.log(new A()) //   { a: undefined, b: undefined, c: undefined }

实际结果:

console.log(new A()) // {}

bug描述:

经测试 hx 中构建的代码与 cli中构建的代码存在明显差异, 下列的bug在cli中不存在, 可以参考我最新上传demo项目

  • 本机node版本: 16.17.0
  • cli版本: 3.8.12
  • hx版本: 3.8.12
{  
  "compilerOptions": {  
    "target": "esnext",  
    "module": "esnext",  
    "strict": true,  
    "jsx": "preserve",  
    "moduleResolution": "node",  
    "esModuleInterop": true,  
    "sourceMap": true,  
    "skipLibCheck": true,  
    "importHelpers": true,  
    "allowSyntheticDefaultImports": true,  
    "useDefineForClassFields": true,  
    "resolveJsonModule": true,  
    "lib": ["esnext", "dom"],  
    "types": ["@dcloudio/types"]  
  },  
  "exclude": ["node_modules", "unpackage"]  
}

按理此时结果应为 { a: undefined, b: undefined, c: undefined }

因项目中存在通过

if (key in obj) {  
   obj[key] = xxx  
}

类的序列化操作, 所以实例内至少得存在该属性, 即使为undefined

测试项目在附件中


## 附件:

- [my-vue3-project_-_副本.zip](https://ask.dcloud.net.cn/file/download/file_name-bXktdnVlMy1wcm9qZWN0Xy1f5Ymv5pysLnppcA==__url-Ly9pbWctY2RuLXRjLmRjbG91ZC5uZXQuY24vdXBsb2Fkcy9xdWVzdGlvbnMvMjAyMzEwMTMvZGRjMWMzNWQwN2Q5YmE0Y2ZiODE2MDgyNjdjYzBmNGQ=)
- ![image](https:https://www.itying.com/uniimg.php?url=https://img-cdn-tc.dcloud.net.cn/uploads/questions/20231013/b1f7a37fbea7cf2ff3790b65b24f8999.png)

| 开发环境 | 版本号 | 项目创建方式 |
|----------|--------|--------------|
| Windows  | 11     | HBuilderX    |
| Android  | 6.0    |              |

更多关于hbuilderX 3.8.12 构建项目输出代码与cli 3.8.12存在差异 uni-app hx中点击发布H5 tsconfig 的 useDefineForClassFields 未生效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

11 回复

完全无人回复吗

更多关于hbuilderX 3.8.12 构建项目输出代码与cli 3.8.12存在差异 uni-app hx中点击发布H5 tsconfig 的 useDefineForClassFields 未生效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


感谢反馈,久等了。我使用新版本 hbuiderx 未能复现你的问题,可能是后续修复了这个问题。如果你还有问题,可以 reopen 继续反馈 ❤️

你好, 我使用最新的 HX3.98 正式版测试问题依然存在, 应该是我没描述清楚的问题, 直接在HX里运行项目是没问题的, 但是发布H5, build之后生成的代码有这个问题, 可以参考我下列的图片

你好, 我使用最新的 HX3.98 正式版测试问题依然存在, 应该是我没描述清楚的问题, 直接在HX里运行项目是没问题的, 但是发布H5, build之后生成的代码有这个问题, 可以参考我下列的图片

我按照下面步骤操作:

安装 3.99 hbuilderx
下载 解压 导入你提供的 zip 文件夹
执行 npm i

执行 npx AT dcoudio/uvmATlatest 安装最新版的依赖
dev 运行 h5 ,build 运行 h5

看下图,结果相同。你按照我的操作试试,用你提供的源码

cli版是没问题的, 主要问题在 hx 内, 也就是你打开项目不用 npm install , 而是直接把 src 文件夹拖到 hbuilderX 内, 运行也是没问题的, 仅也仅在 直接用 hbuilderX 内的 发行 => H5 编译, 生成的代码有问题, 运行到内置浏览器都是OK的, 我在下面增加了 截图, 和一个2分钟的录屏演示, 你可以看下.

主要如果是H5还好解决, 直接用 cli 版就好, 这个问题我最初弄纯nvue的app端发现的, 在纯nvue的app上也有这个问题, 我复现后发现 h5上也有相同问题, 就提的 H5了, app牵扯到云打包/插件这些, 必须使用 hx内的 发行功能打包, 所以不得不解决这个问题

cli版是没问题的, 主要问题在 hx 内, 也就是你打开项目不用 npm install , 而是直接把 src 文件夹拖到 hbuilderX 内, 运行也是没问题的, 仅也仅在 直接用hbuilderX 内的 发行 => H5 编译, 生成的代码有问题, 运行到内置浏览器都是OK的
下面这个截图是, 我用cli版的 npm run build:h5 编译, 和把 src拖到 hx 内用 发行 => H5 编译, 产生结果对比, Hx的结果是有问题的.

我录制了一个视频, 也许能让你更好的理解我这个bug, 已经更新到 hx 3.99 版了 https://test.retrocode.io/20240116_112614.mp4

好,我会验证这个问题

的确有问题,说明内置的 vite.config 有问题,有进展我会更新

回复 DCloud_UNI_OttoJi: 好的好的 感谢

回到顶部