Expo SDK 50/51集成Dynatrace遇开发构建错误求助

我此前在Expo SDK 49中成功集成了Dynatrace，升级至SDK 50再到51后，开发客户端构建时出现以下错误：

Unable to resolve "@dynatrace/react-native-plugin/jsx-dev-runtime" from "App.tsx"

但预览和生产渠道运行正常。我推测原因是Babel会根据环境选择使用jsx-runtime或jsx-dev-runtime，而@dynatrace/react-native-plugin未提供jsx-dev-runtime文件。有没有人解决过这个问题？

使用的依赖版本：

"expo": "^51.0.0",
"@dynatrace/react-native-plugin": "^2.295.1",
"@babel/core": "^7.25.2",
"@babel/parser": "^7.25.3",
"@babel/preset-env": "^7.25.3",
"babel-preset-expo": "~11.0.0",

方案1：添加模块解析别名 #

在项目根目录的metro.config.js中，将缺失的jsx-dev-runtime映射到已存在的jsx-runtime：

const { getDefaultConfig } = require('expo/metro-config');

const config = getDefaultConfig(__dirname);

config.resolver.alias = {
  ...config.resolver.alias,
  '@dynatrace/react-native-plugin/jsx-dev-runtime': '@dynatrace/react-native-plugin/jsx-runtime',
};

module.exports = config;

方案2：强制Babel在开发环境使用生产JSX Runtime #

修改babel.config.js，在开发模式下禁用JSX dev runtime的加载：

module.exports = function(api) {
  api.cache(true);
  const presets = ['babel-preset-expo'];
  const plugins = [];

  if (api.env('development')) {
    plugins.push([
      '@babel/plugin-transform-react-jsx',
      {
        runtime: 'automatic',
        importSource: '@dynatrace/react-native-plugin',
        development: false,
      },
    ]);
  }

  return {
    presets,
    plugins,
  };
};

方案3：升级Dynatrace插件 #

Dynatrace后续版本可能已适配Expo SDK 50+的JSX Runtime规则，尝试升级到最新版：

npm install @dynatrace/react-native-plugin@latest
# 或使用yarn
yarn add @dynatrace/react-native-plugin@latest

内容的提问来源于stack exchange，提问作者Philipp Schweiger