添加口味后如何连接到 Metro Bundle？

Question

我遇到了一个问题，即在向应用程序添加风味后，我无法让我的 React Native 应用程序连接到 Metro 捆绑程序。我搜索了很多可能的解决方案，但无法使其发挥作用。当我使用通过 USB 连接的物理设备时会出现此问题。在我添加风味之前，USB 调试已打开并且一切正常。我需要使用物理设备来测试一些蓝牙功能。

这是我添加到我的 gradle 文件中的内容：

debuggableVariants = ["localDebug"]

flavorDimensions "default"
    productFlavors {
        local {
            resValue "string", "app_name", "Note Ninja (Debug)"
            applicationIdSuffix ".debug"
            versionNameSuffix "-debug"
            buildConfigField "String", "FLAVOR_NAME", "\"local\""
        }
        internal {
            resValue "string", "app_name", "Note Ninja (Internal Testing)"
            versionNameSuffix "-internal"
            buildConfigField "String", "FLAVOR_NAME", "\"internal\""
        }
        prod {
            resValue "string", "app_name", "Note Ninja"
            buildConfigField "String", "FLAVOR_NAME", "\"prod\""
        }
    }

现在我将 npm 脚本调整为以下内容：

"android:local": "react-native run-android --mode=localDebug --appId com.noteninja.debug",

当我运行此脚本时，metro 正在启动并且应用程序已安装在手机上，但我收到错误消息“无法加载脚本。请确保您正在运行 Metro 或捆绑包“index.android.bundle”已打包当我单击重新加载时，我收到错误“无法连接到开发服务器”。

我尝试在手机浏览器中打开 localhost:8081，并且可以访问 Metro，因此这似乎不是防火墙问题。我尝试了 adb reverse tcp:8081 tcp:8081 但这也没有帮助（设备按照我使用 adb devices 时列出的方式进行连接）。我卸载了该应用程序，清除了 gradle 和 Metro 缓存，但似乎没有任何帮助。

Answer 1

在使用 React Native 风格并将物理设备连接到 Metro 捆绑器时，这个问题是一个常见的头痛问题。让我分享一个可能的解决方案，可以帮助您解决这个问题。既然您已经尝试过

adb reverse

并清除缓存，那么让我们重点关注可能被忽略的其他几个步骤。

可能的原因和修复方法

捆绑口味不匹配

index.android.bundle

可能无法与您的口味正确关联。确保您没有意外地为您的自定义风格创建了生产风格的构建。检查您的

gradle.properties

或构建命令以确保

debuggableVariants

包含正确的变体 (

localDebug

)。

将此添加到您的

build.gradle

：

debuggable true
applicationVariants.all { variant ->
    if (variant.buildType.name == "debug" && variant.flavorName == "local") {
        variant.outputs.all {
            outputFileName = "index.android.bundle"
        }
    }
}

确保口味正确传递至 Metro
Metro 捆绑程序可能不知道正在使用哪种风味。尝试在启动 Metro 时明确指定风格和模式。

修改您的
```
package.json
```
添加：
```
"start:local": "react-native start --reset-cache"
```
然后，在安装应用程序之前运行 Metro：
```
npm run start:local
```
React Native Flavors 配置
仔细检查您的
```
settings.gradle
```
和
```
build.gradle
```
文件。确保您的
```
localDebug
```
风格正确映射并解析为正确的构建变体。有时，不匹配的风味名称可能会导致问题。
设备连接
再次运行以下命令以确保正确连接：
```
adb reverse tcp:8081 tcp:8081
adb shell input keyevent 82 # Ensures the device stays awake
```
此外，请检查系统上的
```
ipconfig
```
或
```
ifconfig
```
，并确认 Metro 正在预期的 IP 地址上提供服务（默认为
```
localhost:8081
```
）。

启用调试风格的明文流量
将其添加到您的

AndroidManifest.xml

以获得

localDebug

风味：

<application android:usesCleartextTraffic="true" />

检查应用程序安装路径
有时，风格会生成与 Metro 捆绑程序期望的不匹配的不同应用程序 ID。验证您的
```
com.noteninja.debug
```
是否已正确解析。
使用特定配置运行 Metro
有时，Metro 捆绑程序需要明确的指示。像这样运行地铁：
```
npx react-native start --reset-cache --port 8081
```
重建Gradle
如果以上方法均无效，请尝试完全重建：
```
cd android
./gradlew clean
cd ..
npm run android:local
```

额外调试

检查
```
adb devices
```
，确保设备连接正确。
使用
```
adb logcat
```
检查日志中是否有更具体的错误。
在浏览器上打开
```
localhost:8081/debugger-ui
```
并确保 Metro 正在运行。

按照以下步骤操作，您应该能够解决问题。如果问题仍然存在，请尝试共享完整日志以进行更深入的分析。

添加口味后如何连接到 Metro Bundle？

问题描述投票：0回答：1

1个回答

可能的原因和修复方法

额外调试

最新问题

添加口味后如何连接到 Metro Bundle？

问题描述 投票：0回答：1

1个回答

可能的原因和修复方法

额外调试

最新问题

问题描述投票：0回答：1