弃用的 ViewPropTypes 反应本机

Question

我在这里尝试解决方案并定义我的 babel.config.js 如下：

const path = require('path');
module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    [
      'module-resolver',
      {
        root: ['./src'],
        extensions: ['.ios.js', '.android.js', '.js', '.ts', '.tsx', '.json'],
        alias: {
          tests: ['./tests/'],
          '@components': './src/components',
        },
      },
    ],
    [
      'module-resolver',
      {
        root: ['.'],
        resolvePath(sourcePath, currentFile) {
          if (
            sourcePath === 'react-native' &&
            currentFile.includes('react-native-camera/src/RNCamera.js')
          ) {
            console.log('resolver', sourcePath, currentFile);
            return path.resolve(__dirname, 'resolver/react-native');
          }
          return undefined;
        },
      },
    ],
  ],
};

在我的解析器中我这样做了：

import * as ReactNative from 'react-native';

delete ReactNative.ColorPropType;
delete ReactNative.EdgeInsetsPropType;
delete ReactNative.ImagePropTypes;
delete ReactNative.PointPropType;
delete ReactNative.TextInputPropTypes;
delete ReactNative.TextPropTypes;
delete ReactNative.ViewPropTypes;

module.exports = {
  ...ReactNative,
  get ViewPropTypes() {
    return require('deprecated-react-native-prop-types/DeprecatedViewPropTypes');
  },

  get ColorPropType() {
    return require('deprecated-react-native-prop-types/DeprecatedColorPropType');
  },

  get EdgeInsetsPropType() {
    return require('deprecated-react-native-prop-types/DeprecatedEdgeInsetsPropType');
  },

  get PointPropType() {
    return require('deprecated-react-native-prop-types/DeprecatedPointPropType');
  },
};

但它给我的错误如下：

错误：index.js：检测到重复的插件/预设。 如果您想使用一个插件的两个独立实例， 他们需要单独的名字，例如

插件：[ ['一些插件', {}], ['some-plugin', {}, '一些独特的名字'], ]

我怎么解决这个问题。我认为它与 babel.config.js 文件有关......我如何正确定义我的 babel.config？

Answer 1

使用补丁包

创建文件补丁/react-native-camera+4.2.1.patch

diff --git a/node_modules/react-native-camera/src/RNCamera.js 
b/node_modules/react-native-camera/src/RNCamera.js
index b7a271a..ea3c6d2 100644
--- a/node_modules/react-native-camera/src/RNCamera.js
+++ b/node_modules/react-native-camera/src/RNCamera.js
@@ -5,7 +5,7 @@ import {
   findNodeHandle,
   Platform,
   NativeModules,
-  ViewPropTypes,
+  ViewProps,
   requireNativeComponent,
   View,
   ActivityIndicator,
@@ -394,7 +394,7 @@ export default class Camera extends React.Component<PropsType, StateType> {
   };

   static propTypes = {
-    ...ViewPropTypes,
+    ...ViewProps,
     zoom: PropTypes.number,
     useNativeZoom: PropTypes.bool,
     maxZoom: PropTypes.number,

然后在 package.json 中添加脚本

"postinstall": "npx patch-package",