javascript - 如何在 React Native 中查看 javascript 包代码？

Question

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

我想查看 bundle 中的 javascript 代码，这样我就可以看到 TypeScript 和 Babel 修改了什么。具体来说，我试图了解 TS 和 Babel 如何处理类构造函数的默认参数。

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

有什么方法可以查看 TS 和 Babel 创建的 javascript 输出？

Answer 1

您可以自己生成 bundle ，然后对其进行检查。

在终端上运行时访问 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