屬性'require'不會在本機反應中存在

Question

我認為這個錯誤來自 metro bundler，這是錯誤的圖片：

我嘗試了來自官方 React Native GitHub 問題的每個 on.net 解決方案。

1. 也嘗試刪除節點模塊
2. 重啟緩存

在終端上它沒有顯示任何錯誤，但在設備上它拋出錯誤。 有幫助嗎？

'''babel.config.js'''

module.exports = {
       presets: ['module:metro-react-native-babel-preset',
      '@babel/preset-typescript','@babel/preset-env'],
       plugins: [
       ['@babel/plugin-proposal-class-properties'],
       ['module:react-native-dotenv',
  {
    moduleName: '@env',
    path: '.env',
  },
],
'react-native-reanimated/plugin',
[
  'module-resolver',
  {
    root: ['./src/'],
    alias: {
      '@assets': './src/assets',
      '@components': './src/components',
      '@constants': './src/constants',
      '@navigation': './src/navigations',
      '@screens': './src/screens',
      '@utils': './src/utils',
      '@styles': './src/styles',
      '@redux': './src/redux',
      '@config': './src/config',
    },
  },
],
],
};

''' metro.config.js '''

module.exports = {
       transformer: {
        getTransformOptions: async () => ({
         transform: {
           experimentalImportSupport: false,
            inlineRequires: true,
              },
               }),
               }, 
              };

'''jestConfig.ts'''

import mockAsyncStorage from '@react-native-async-storage/async-storage/jest/async-storage-mock';
import 'react-native-gesture-handler/jestSetup';

 jest.mock('react-native/Libraries/EventEmitter/NativeEventEmitter');

 jest.mock('react-native-keyboard-controller', () => ({}));
 jest.mock('react-native-bootsplash', () => {
        return {
           hide: jest.fn(),
           show: jest.fn(),
             };
            });

 jest.mock('@notifee/react-native', () => ({}));

  jest.mock('@react-native-async-storage/async-storage', () => mockAsyncStorage);

      jest.mock('axios', () => {
          return {
          create: () => {
            return {
              get: jest.fn(),
               post: jest.fn(),
               put: jest.fn(),
                interceptors: {
                request: {eject: jest.fn(), use: jest.fn()},
                response: {eject: jest.fn(), use: jest.fn()},
                  },
            };
           },
          };
        });

     export {};

'''package.json'''

  {
     "name": "name",
     "version": "0.0.1",
     "private": true,
     "scripts": {
        "android": "react-native run-android",
        "ios": "react-native run-ios",
        "start": "react-native start",
         "test": "jest",
          "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
        },
       "dependencies": {
           "@notifee/react-native": "^7.2.0",
           "@react-native-async-storage/async-storage": "^1.17.10",
           "@react-native-masked-view/masked-view": "^0.2.8",
          "@react-navigation/bottom-tabs": "^6.4.0",
           "@react-navigation/native": "^6.0.13",
          "@react-navigation/native-stack": "^6.9.1",
          "@reduxjs/toolkit": "^1.8.6",
           "@shopify/flash-list": "^1.3.1",
           "@types/lodash": "^4.14.191",
           "axios": "^1.2.1",
           "babel-plugin-module-resolver": "^4.1.0",
           "native-base": "^3.4.22",
             "react": "18.1.0",
             "react-native": "0.70.6",
             "react-native-bootsplash": "^4.3.2",
               "react-native-dotenv": "^3.4.2",
              "react-native-fast-image": "^8.6.3",
              "react-native-gesture-handler": "^2.7.1",
               "react-native-keyboard-controller": "^1.4.2",
                "react-native-modal": "^13.0.1",
               "react-native-pager-view": "^6.1.2",
                 "react-native-pusher-push-notifications": "^2.5.1",
                  "react-native-reanimated": "^2.11.0",
                  "react-native-responsive-screen": "^1.4.2",
                  "react-native-safe-area-context": "3.3.2",
                  "react-native-screens": "^3.18.2",
                 "react-native-svg": "12.1.1",
                  "react-native-tab-view": "^3.3.4",
                  "react-native-vector-icons": "^9.2.0",
                  "react-native-webview": "^11.26.0",
                  "react-redux": "^8.0.4",
                  "redux": "^4.2.0",
                   "redux-logger": "^3.0.6",
                   "redux-persist": "^6.0.0",
                    "redux-thunk": "^2.4.2",
                    "ts-jest": "^29.0.3"
                    },
            "devDependencies": {
                "@babel/core": "^7.12.9",
                 "@babel/preset-env": "^7.20.2",
                 "@babel/preset-react": "^7.18.6",
                 "@babel/preset-typescript": "^7.18.6",
                   "@babel/runtime": "^7.12.5",
                   "@react-native-community/eslint-config": "^2.0.0",
                    "@tsconfig/react-native": "^2.0.2",
                    "@types/jest": "29.0.3",
                     "@types/react": "^18.0.21",
                    "@types/react-native": "^0.70.6",
                     "@types/react-native-dotenv": "^0.2.0",
                     "@types/react-native-vector-icons": "^6.4.12",
                      "@types/react-test-renderer": "^18.0.0",
                     "@types/redux-logger": "^3.0.9",
                     "@types/redux-persist": "^4.3.1",
                      "@typescript-eslint/eslint-plugin": "^5.37.0",
                       "@typescript-eslint/parser": "^5.37.0",
                        "babel-jest": "29.0.3",
                       "babel-plugin-transform-require-context": "^0.1.1",
                       "eslint": "^7.32.0",
                     "jest": "29.0.3",
                     "metro-react-native-babel-preset": "0.72.3",
                     "react-native-typescript-transformer": "^1.2.13",
                       "react-test-renderer": "18.1.0",
                      "typescript": "^4.8.3"
                              },
                   "jest": {
                        "preset": "react-native",
                         "moduleFileExtensions": [
                                      "ts",
                                      "tsx",
                                       "js",
                                       "jsx",
                                       "json",
                                        "node"
                                            ],
                        "setupFiles": [
                             "./jestConfig.ts"
                                 ],
                            "transformIgnorePatterns": [
                      "node_modules/node_modules/react-native-responsive-screen/index.js"
            ]
           }
           }

Answer 1

這一行：

導入 'react-native-gesture-handler/jestSetup';

大概應該是這樣的：

從 'react-native-gesture-handler/jestSetup' 導入 jestSetup；

檢查庫的文檔該導入應該如何工作。