首页 > 解决方案 > 如何在 React Native 中查看 javascript 包代码?

问题描述

我有一个React Native 0.57.8使用 TypeScript 和 Babel 7 的项目。

我想查看捆绑包中的 javascript 代码,以便查看 TypeScript 和 Babel 已修改的内容。具体来说,我想看看 TS 和 Babel 如何处理类构造函数的默认参数。

我知道this.parameter = parameter如果构造函数参数被赋予一个修饰符,例如 public、private 或 readonly,TS 将添加到类构造函数体中,但我不知道this.parameter = parameter是添加到构造函数体的开头还是结尾构造函数体。

有没有办法可以查看 TS 和 Babel 创建的 javascript 输出?

标签: javascripttypescriptreact-nativebabeljs

解决方案


您可以自己生成捆绑包,然后对其进行检查。

在终端上运行时访问 Metro Bundler url,例如 http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false

(如果尚未缓存,这可能需要一整代,因此可能需要一段时间)。

或者只是通过命令行生成一个静态文件:

// iOS
npx react-native bundle --entry-file=index.js --bundle-output='./bundle.js' --dev=false --platform='ios' --assets-dest='./ios' --reset-cache
// Android
npx react-native bundle --entry-file=index.js --bundle-output='./bundle.js' --dev=false --platform='android' --assets-dest='./android/app/src/main/res' --reset-cache

推荐阅读