Expo SDK从48升级到50遇Duplicate __self prop错误求助

你在升级Expo SDK 48到50时遇到了以下错误：

error: node_modules/expo-modules-core/build/NativeViewManagerAdapter.native.js: /Users/maximilianofriedl/Documents/examedi/patient-app/node_modules/expo-modules-core/build/NativeViewManagerAdapter.native.js: Duplicate __self prop found. You are most likely using the deprecated transform-react-jsx-self Babel plugin. Both __source and __self are automatically set when using the automatic runtime. Please remove transform-react-jsx-source and transform-react-jsx-self from your Babel config.

虽然你的babel配置里没有显式添加transform-react-jsx-source和transform-react-jsx-self插件，但问题出在重复引入的Babel预设上，以下是具体解决步骤：

1. 移除重复的Babel预设 #

你的babel.config.js中同时引入了babel-preset-expo和module:metro-react-native-babel-preset，但babel-preset-expo已经内置了适配Expo的React Native Babel配置，重复引入metro预设会导致其内置的废弃JSX插件与自动运行时冲突。

修改后的babel.config.js如下：

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: [
      "nativewind/babel",
      "babel-plugin-root-import",
      [
        "@babel/plugin-proposal-class-properties",
        {
          loose: true,
        },
      ],
      [
        require.resolve("babel-plugin-module-resolver"),
        {
          root: ["./src/"],
          alias: {
            test: "./test",
          },
        },
      ],
      "react-native-reanimated/plugin",
    ],
  };
};

2. 更新适配SDK50的依赖版本 #

确保你的核心Babel依赖版本与Expo SDK50兼容：

• 将@babel/core升级到^7.23.0或更高版本
• 确保babel-preset-expo更新到SDK50对应的版本（推荐~10.0.6）
• 若后续仍需要metro相关预设，将metro-react-native-babel-preset升级到^0.79.0左右（适配RN 0.72/SDK50）

修改后的package.json相关依赖示例：

"dependencies": {
  "babel-preset-expo": "~10.0.6",
},
"devDependencies": {
  "@babel/core": "^7.23.0",
  "@babel/plugin-proposal-class-properties": "^7.18.6",
  "babel-plugin-module-resolver": "^5.0.0",
  "babel-plugin-root-import": "^6.6.0",
  "metro-react-native-babel-preset": "^0.79.0",
  "react-native-svg-transformer": "^1.4.0",
},

3. 清理缓存并重启项目 #

运行以下命令清理Metro缓存，避免旧配置残留：

npx expo start --clear

额外检查点 #

• 确认项目中没有其他Babel配置文件（比如.babelrc或.babelrc.js），如果有，确保里面没有引入transform-react-jsx-source和transform-react-jsx-self插件
• 检查react-native-svg-transformer版本是否适配SDK50，必要时升级到最新稳定版

内容的提问来源于stack exchange，提问作者Maximiliano Andres Friedl Schw